背景

在使用vue时 由于项目过大,编译过程出现错误,截图大致如下
这里写图片描述

原因

原因是 JavaScript堆内存不足,这里说的 JavaScript 其实就是 Node,我们都知道 Node 是基于V8引擎,在一般的后端开发语言中,在基本的内存使用上没有什么限制,但是我去查阅了相关的资料才发现,在 Node 中通过 JavaScript 使用内存时只能使用部分内存(64位系统下约为1.4 GB,32位系统下约为0.7 GB),这就是我们编译项目时为什么会出现内存泄露了,因为前端项目如果非常的庞大,webpack 编译时就会占用很多的系统资源,如果超出了V8对 Node 默认的内存限制大小就会出现这种现象。

解决办法

1 首先肯定是代码级别的尝试,写出来好的代码 肯定就不会出现这种现象
2 扩大我们项目的使用内存

    node --max-old-space-size=1700 test.js // 单位为MB
    // 或者
    node --max-new-space-size=1024 test.js // 单位为KB

vue 基于 vue-cli 生成的项目,vue没有把 package.json 里面 scripts 字段的脚本命令的node命令隐藏起来,我们直接把上面v8提供的选项参数直接写入scripts 字段的 node 命令后就好了,示例如下

“build”: “node –max_old_space_size=4096 build/build.js”

直接在 node 后面写上 –max_old_space_size=4096 就好了,我这里设置的内存大小是4G,这个具体的大小可以根据自己的项目情况来设置就好了。然后再重新运行 npm run build 就可以正常打包构建了。

参考文献:

https://segmentfault.com/a/1190000010437948
https://stackoverflow.com/questions/38558989/node-js-heap-out-of-memory
Logo

前往低代码交流专区

更多推荐