Laravel7+Vue2生产构建报错：JavaScript堆内存不足

开发者阿泽

2026-7-29

Laravel7 + Vue2 执行npm run prod时JavaScript堆内存不足的解决方案

问题详情

执行npm run prod时触发以下错误：

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

完整错误日志：

> @ prod /var/www/html/exptradies
> npm run production


> @ production /var/www/html/exptradies
> cross-env NODE_ENV=production node_modules/webpack/bin/webpack.js --no-progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js


<--- Last few GCs --->

[3521:0x302b050]   110565 ms: Mark-sweep 489.2 (517.6) -> 485.0 (517.6) MB, 1150.6 / 0.0 ms  (average mu = 0.155, current mu = 0.100) allocation failure scavenge might not succeed
[3521:0x302b050]   111997 ms: Mark-sweep 489.2 (517.6) -> 485.0 (517.6) MB, 1222.8 / 0.0 ms  (average mu = 0.150, current mu = 0.146) allocation failure scavenge might not succeed


<--- JS stacktrace --->

==== JS stack trace =========================================

Security context: 0x384b92cc08d1 <JSObject>
    0: builtin exit frame: concat(this=0x0871a8909981 <JSArray[0]>,0x0871a8909961 <JSArray[0]>,0x0871a8909981 <JSArray[0]>)

    1: /* anonymous */(aka /* anonymous */) [0x20144909fd61] [/var/www/html/exptradies/node_modules/terser-webpack-plugin/node_modules/terser/dist/bundle.min.js:~1] [pc=0x21c8562eee7d](this=0x349882d804b1 <undefined>,0x3c3d355838b9 <AST_Call map = 0x1ea8d45e1279>,0x0871a89...

FATAL ERROR: Ineffective mark-compacts near heap limit Allocation failed - JavaScript heap out of memory
 1: 0xa1ae50 node::Abort() [node]
 2: 0xa1b25c node::OnFatalError(char const*, char const*) [node]
 3: 0xb9b20e v8::Utils::ReportOOMFailure(v8::internal::Isolate*, char const*, bool) [node]
 4: 0xb9b589 v8::internal::V8::FatalProcessOutOfMemory(v8::internal::Isolate*, char const*, bool) [node]
 5: 0xd58815  [node]
 6: 0xd58ea6 v8::internal::Heap::RecomputeLimits(v8::internal::GarbageCollector) [node]
 7: 0xd65765 v8::internal::Heap::PerformGarbageCollection(v8::internal::GarbageCollector, v8::GCCallbackFlags) [node]
 8: 0xd66615 v8::internal::Heap::CollectGarbage(v8::internal::AllocationSpace, v8::internal::GarbageCollectionReason, v8::GCCallbackFlags) [node]
 9: 0xd690cc v8::internal::Heap::AllocateRawWithRetryOrFail(int, v8::internal::AllocationType, v8::internal::AllocationOrigin, v8::internal::AllocationAlignment) [node]
10: 0xd2f752 v8::internal::Factory::AllocateRawWithAllocationSite(v8::internal::Handle<v8::internal::Map>, v8::internal::AllocationType, v8::internal::Handle<v8::internal::AllocationSite>) [node]
11: 0xd3b104 v8::internal::Factory::NewJSArrayWithUnverifiedElements(v8::internal::Handle<v8::internal::FixedArrayBase>, v8::internal::ElementsKind, int, v8::internal::AllocationType) [node]
12: 0xd3b549 v8::internal::Factory::NewJSArray(v8::internal::ElementsKind, int, int, v8::internal::ArrayStorageAllocationMode, v8::internal::AllocationType) [node]
13: 0xec65c3 v8::internal::ElementsAccessor::Concat(v8::internal::Isolate*, v8::internal::Arguments*, unsigned int, unsigned int) [node]
14: 0xc0a565  [node]
15: 0xc12dfd v8::internal::Builtin_ArrayConcat(int, unsigned long*, v8::internal::Isolate*) [node]
16: 0x140e919  [node]
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! @ production: `cross-env NODE_ENV=production node_modules/webpack/bin/webpack.js --no-progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js`
npm ERR! Exit status 1
npm ERR! 
npm ERR! Failed at the @ production 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!     /root/.npm/_logs/2023-03-02T16_32_12_621Z-debug.log
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! @ prod: `npm run production`
npm ERR! Exit status 1
npm ERR! 
npm ERR! Failed at the @ prod 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!     /root/.npm/_logs/2023-03-02T16_32_12_662Z-debug.log

当前环境版本：

jawadi@groovy-voyage:/$ npm --version
6.14.16
jawadi@groovy-voyage:/$ node --version
v12.22.12

webpack.mix.js内容：

const mix = require("laravel-mix");

/*
 |--------------------------------------------------------------------------
 | Mix Asset Management
 |--------------------------------------------------------------------------
 |
 | Mix provides a clean, fluent API for defining some Webpack build steps
 | for your Laravel application. By default, we are compiling the Sass
 | file for the application as well as bundling up all the JS files.
 |
 */

mix.js("resources/js/app.js", "public/js").sass(
    "resources/sass/app.scss",
    "public/css"
);

mix.browserSync(process.env.APP_URL);

解决方案

1. 临时增加Node.js堆内存限制

直接在执行命令时指定堆内存大小，比如分配2GB内存：

node --max-old-space-size=2048 node_modules/webpack/bin/webpack.js --no-progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js

或者修改package.json中的scripts，替换原有的production命令：

"scripts": {
    "prod": "npm run production",
    "production": "cross-env NODE_ENV=production node --max-old-space-size=2048 node_modules/webpack/bin/webpack.js --no-progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js"
}

修改后重新执行npm run prod即可。如果2GB不够，可以尝试设置为3072（3GB）或4096（4GB）。

2. 优化Laravel Mix构建配置

关闭不必要的功能：生产环境构建不需要browserSync，可以仅在开发环境启用：
修改webpack.mix.js：

const mix = require("laravel-mix");

mix.js("resources/js/app.js", "public/js").sass(
    "resources/sass/app.scss",
    "public/css"
);

// 仅在开发环境启用browserSync
if (!mix.inProduction()) {
    mix.browserSync(process.env.APP_URL);
}

拆分JS代码：如果app.js体积过大，拆分第三方库和业务代码，减少单文件打包压力：

// 拆分第三方库到独立文件
mix.extract(['vue', 'axios']);
mix.js("resources/js/app.js", "public/js").sass("resources/sass/app.scss", "public/css");

3. 更新Node.js版本

Node.js v12已停止维护，新版本对内存管理有优化，建议升级到v14或v16（LTS版本）：

使用nvm安装指定版本：

# 安装nvm
curl -o- https://raw.githubusercontent.com/nvm-sh/nvm/v0.39.3/install.sh | bash
# 重新加载终端后安装v16
nvm install 16
nvm use 16

验证版本：

node --version # 应显示v16.x.x
npm --version # 对应v8.x.x

重新安装依赖：

rm -rf node_modules package-lock.json
npm install

之后再执行npm run prod。

4. 禁用Terser压缩（临时应急方案）

如果以上方法无效，可临时关闭代码压缩（会导致打包文件变大，但能完成构建）：
修改webpack.mix.js：

const mix = require("laravel-mix");

mix.js("resources/js/app.js", "public/js").sass(
    "resources/sass/app.scss",
    "public/css"
).options({
    terser: {
        enabled: false
    }
});

if (!mix.inProduction()) {
    mix.browserSync(process.env.APP_URL);
}

内容的提问来源于stack exchange，提问作者Zia