构建 Vue.js 应用程序时 JavaScript 堆内存不足

Posted 2023-02-22

【中文标题】构建 Vue.js 应用程序时 JavaScript 堆内存不足

【英文标题】：JavaScript heap out of memory when building Vue.js app

【发布时间】：2019-09-14 11:59:16

【问题描述】：

我正在尝试构建一个用于生产的 vue.js 应用程序。此错误消息总是在中途出现。

FATAL ERROR: Ineffective mark-compacts near heap limit Allocation failed - javascript heap out of memory

我已经尝试通过添加--max_old_space_size=4096 来增加内存，甚至尝试将其更改为8192，但无济于事。我使用的是 8 GB RAM 的 Mac，所以我不确定为什么会这样。

这是我为 npm run build 运行的代码：

vue-cli-service build --max_old_space_size=4096

【参考方案1】：

我也遇到了这个问题。 Node 存在内存限制，因此运行此命令有效：

NODE_OPTIONS=--max_old_space_size=4096 npm run build

在 Windows 上，使用：

set NODE_OPTIONS=--max_old_space_size=4096 
npm run build

Node 的默认内存限制为 512MB，运行此命令暂时将其增加到 4GB。

【讨论】：

嗨，你能帮帮我吗？我正在使用vue 和laravel 构建一个应用程序。我正在使用带有keep-alive 的动态组件，并且要保持活动状态的最大组件数是5。我正在使用npm run watch 来观察vue 应用程序中的变化。但是，在开发过程中，我随机遇到了上述 OP 和 watch 也关闭的问题。我的问题是，当我将应用程序发送到生产环境时，这是一个问题吗？为什么会突然发生这种情况？这是因为动态组件还是keep-alive？这也可以在生产中发生吗？请帮帮我！

@S.Farooq - 我认为如果你把它作为一个独立的问题来创建会很好，有很多可能性，使用 cmets 系统很难探索。

【参考方案2】：

如果您有一个大型项目，每个文件夹中都有每个 .less 文件（例如组件、视图），您可能会遇到这个问题。

我已经通过将所有 .less 文件移动到一个文件夹“/assets/less/”并将它们全部导入“/assets/less/index.less”来解决这个问题