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

 更新时间:2023年01月20日 15:47:33   作者:@我不认识你  
这篇文章主要介绍了vue项目内存溢出问题及解决方案,具有很好的参考价值,希望对大家有所帮助。如有错误或未考虑完全的地方,望不吝赐教

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

总结

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

相关文章

  • 详解用webpack2.0构建vue2.0超详细精简版

    详解用webpack2.0构建vue2.0超详细精简版

    本篇文章主要介绍了详解用webpack2.0构建vue2.0超详细精简版,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2017-04-04
  • vue2的todolist入门小项目的详细解析

    vue2的todolist入门小项目的详细解析

    本篇文章主要介绍了vue2的todolist入门小项目的详细解析,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2017-05-05
  • vue使用docxtemplater导出word

    vue使用docxtemplater导出word

    docxtemplater 是一种邮件合并工具,以编程方式使用并处理条件、循环,并且可以扩展以插入任何内容,下面我们来看看如何使用docxtemplater导出word吧
    2025-04-04
  • vue项目中图片选择路径位置static或assets的区别及说明

    vue项目中图片选择路径位置static或assets的区别及说明

    这篇文章主要介绍了vue项目中图片选择路径位置static或assets的区别及说明,具有很好的参考价值,希望对大家有所帮助。如有错误或未考虑完全的地方,望不吝赐教
    2022-09-09
  • Vue keepAlive页面强制刷新方式

    Vue keepAlive页面强制刷新方式

    这篇文章主要介绍了Vue keepAlive页面强制刷新方式,具有很好的参考价值,希望对大家有所帮助。如有错误或未考虑完全的地方,望不吝赐教
    2023-05-05
  • vue3组合式API中setup()概念和reactive()函数的用法

    vue3组合式API中setup()概念和reactive()函数的用法

    这篇文章主要介绍了vue3组合式API中setup()概念和reactive()函数的用法,接下来的事件,我将带着你从浅到深分析为什么我们需要学习组合式API以及我们的setup()函数作为入口函数的一个基本的使用方式,需要的朋友可以参考下
    2023-03-03
  • 解决Vue打包上线之后部分CSS不生效的问题

    解决Vue打包上线之后部分CSS不生效的问题

    今天小编就为大家分享一篇解决Vue打包上线之后部分CSS不生效的问题,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧
    2019-11-11
  • Vue中实现路由跳转传参的4种方式

    Vue中实现路由跳转传参的4种方式

    本文详尽的讲了在Vue项目中,如何实现路由跳转传参的4四种方式(2大路由跳转方式,每种方式包括4种路由传参实现形式),以及每种方式中实现路由跳转包括路由传参的方法的各种写法,需要的朋友可以参考下
    2024-04-04
  • vue完成项目后,打包成静态文件的方法

    vue完成项目后,打包成静态文件的方法

    今天小编就为大家分享一篇vue完成项目后,打包成静态文件的方法,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧
    2018-09-09
  • Vue编译优化实现流程详解

    Vue编译优化实现流程详解

    编译优化指的是编译器将模板编译为渲染函数的过程中,尽可能多的提取关键信息,并以此指导生成最优代码的过程,优化的方向主要是区分动态内容和静态内容,并针对不同的内容采用不同的优化策略
    2023-01-01

最新评论