vue项目内存溢出问题及解决方案

目录
  • vue项目内存溢出的解决
  • vue项目内存溢出问题
    • 问题
    • 解决方法1
    • 解决方法2
  • 总结

vue项目内存溢出的解决

最近在对原有项目进行迭代升级,有用代码越来越多,导致内存溢出了。

正常启动运行还是可以的,但是 只要对代码进行简单修改,在热更新的时候项目就会直接崩掉。这就导致了10分支的开发差不多有7分钟的时间在重启项目,严重影响开发效率,让人上火。

刚好同事之前也遇到过,特点问了一下解决方式。

说下解决

npm install -g increase-memory-limit
npx cross-env LIMIT=4000 increase-memory-limit

先全局安装增加项目运行内存的依赖,然后修改内存限制(4000是4000kb,我项目用到是6000)。

最后删掉依赖,重新下载,重新启动项目即可。

vue项目内存溢出问题

young object promotion failed Allocation failed - JavaScript heap out of memory

在开前端项目如果非常的庞大,webpack 编译时就会占用很多的系统资源,如果超出了V8对 Node 默认的内存限制大小就会出现内存溢出问题

提示:以下是本篇文章正文内容,下面案例可供参考

问题

FATAL ERROR: MarkCompactCollector: young object promotion failed Allocation failed - JavaScript heap out of memory
npm ERR! code ELIFECYCLE
npm ERR! errno 134
npm ERR! study-model-dmo@1.0.0 dev: `webpack-dev-server --inline --progress --config build/webpack.dev.conf.js`
npm ERR! Exit status 134
npm ERR!
npm ERR! Failed at the study-model-dmo@1.0.0 dev script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.

npm ERR! A complete log of this run can be found in:
npm ERR!     D:\work\tools\node\node_cache\_logs\2021-07-06T01_29_07_637Z-debug.log

解决方法1

在node_modules.bin下的webpack-dev-server文件中添加 --max_old_space_size=4096,可以根据项目调整大小

解决方法2

如果上面方法没有用,可以尝试升级nodejs的版本,或重新安装nodejs

总结

以上为个人经验,希望能给大家一个参考,也希望大家多多支持我们。

(0)

相关推荐

  • Vue-cli3执行serve和build命令时nodejs内存溢出问题及解决

    目录 Vue-cli3执行serve和build命令时nodejs内存溢出 Vue-cli3内存溢出问题 Vue-cli3 尝试过很多方法 总结 Vue-cli3执行serve和build命令时nodejs内存溢出 前端项目越来越大,最近在执行serve和build命令时出现了 CALL_AND_RETRY_LAST Allocation failed - JavaScript heap out of memory 错误. 这是因为在webapck打包过程中占用的内存堆栈超出了node.js中采

  • 解决vue内存溢出报错的问题

    目录 vue内存溢出报错 vue项目打包内存溢出问题踩坑 打包时一直报错 从网上搜的答案还是踩坑了 最终针对我的有效方案 vue内存溢出报错 '"node --max-old-space-size=10240"' 不是内部或外部命令,也不是可运行的程序或批处理文件.npm ERR! code ELIFECYCLEnpm ERR! errno 9009npm ERR! mscodevue@3.0.2 dev: `vue-cli-service serve`npm ERR! Exit st

  • 解决运行vue项目内存溢出问题

    目录 运行vue项目内存溢出 记录一下 JavaScript heap out of memory(Vue项目运行内存溢出) 解决方法 运行vue项目内存溢出 npm clone下拉的项目,start时,报超出内存.查询各种方法,下面这种,解决了问题. 记录一下 (1)全局安装increase-memory-limit npm install -g increase-memory-limit (2)进入相应的项目目录下,执行 increase-memory-limit 然后再运行就不会内存溢出了

  • vue项目运行或打包时,频繁内存溢出情况问题

    目录 vue项目运行或打包,频繁内存溢出 解决方案 项目内存溢出导致项目启动失败解决 现象 方案 vue项目运行或打包,频繁内存溢出 Vue项目运行或打包时,频繁内存溢出情况 CALL_AND_RETRY_LAST Allocation failed - JavaScript heap out of memory 前端使用基于vue的Nuxt框架,但是随着项目功能增多,项目变大,频繁出现此种情况,原因是项目太大,导致内存溢出,排除代码问题外,可参照以下方式解决 解决方案 1.全局安装increa

  • vue项目出现页面空白的解决方案

    今天新建项目,然后发现路由也改了  app.vue里面也是啥都没有, 但是访问http://localhost:8080/#/login  能访问  里面确实空白的 错误: 错误原因: path: '/'   只能有1个 整个项目只能有一个[但是我有了2个],然后我要重定向到login页面,我path又没配置好. 导致页面啥都出不来. 解决办法如下: 以上这篇vue项目出现页面空白的解决方案就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持我们.

  • 详解基于node的前端项目编译时内存溢出问题

    前段时间公司有个基于vue的项目在运行npm run build的时候会报内存溢出,今天在某个技术流交群也有位小伙伴基于angular的项目也出现了这个问题,所以查了一些相关的资料总结了一下,下面会详细说明前端三大框架编译时遇到这个问题具体怎么解决.首先看我模拟出的报错内容 具体截图如下 里面有句关键的话,CALL_AND_RETRY_LAST Allocation failed - JavaScript heap out of memory JavaScript堆内存不足,这里说的 JavaS

  • Android 使用帧动画内存溢出解决方案

    Android 使用帧动画内存溢出解决方案 最近在项目遇到的动画效果不好实现,就让UI切成图,采用帧动画实现效果,但是在使用animation-list时,图片也就11张,每张图片大概560k左右,结果内存溢出,崩溃 了,自己用了三张都崩溃:拿代码说: 1.anin_searh.xml <?xml version="1.0" encoding="utf-8"?> <animation-list xmlns:android="http://

  • Android编程之内存溢出解决方案(OOM)实例总结

    本文实例总结了Android编程之内存溢出解决方案(OOM).分享给大家供大家参考,具体如下: 在最近做的工程中发现加载的图片太多或图片过大时经常出现OOM问题,找网上资料也提供了很多方法,但自己感觉有点乱,特此,今天在不同型号的三款安卓手机上做了测试,因为有效果也有结果,今天小马就做个详细的总结,以供朋友们共同交流学习,也供自己以后在解决OOM问题上有所提高,提前讲下,片幅有点长,涉及的东西太多,大家耐心看,肯定有收获的,里面的很多东西小马也是学习参考网络资料使用的,先来简单讲下下: 一般我们

  • Spring Cloud Gateway 内存溢出的解决方案

    记 Spring Cloud Gateway 内存溢出查询过程 环境配置: org.springframework.boot : 2.1.4.RELEASE org.springframework.cloud :Greenwich.SR1 事故记录: 由于网关存在 RequestBody 丢失的情况,顾采用了网上的通用解决方案,使用如下方式解决: @Bean public RouteLocator tpauditRoutes(RouteLocatorBuilder builder) { retu

  • 解决MyEclipse下启动项目时JBoss内存溢出的问题

    配置1: -Xms64m -Xmx512m 配置2: -c default -b 0.0.0.0 -Xmx1024M -Xms512M -XX:MaxPermSize=256m 以上这篇解决MyEclipse下启动项目时JBoss内存溢出的问题就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持我们.

  • Vue项目webpack打包部署到Tomcat刷新报404错误问题的解决方案

    遇到的问题 使用webpack打包vue后,将打包好的文件,发布到Tomcat上,访问成功,但是刷新后页面报404错. 在网上查找了一下,原来是HTML5 History 模式引发的问题,具体为什么,vue官方已经给出了解释,你可以看https://router.vuejs.org/zh-cn/essentials/history-mode.html 但是看完问题又来了,官方给出的解决方案中没有说tomcat下,怎么决解. 解决方案 根据官方给出的解决方案原理 你要在服务端增加一个覆盖所有情况的

随机推荐

其他