如何解决Angular项目中的JavaScript堆内存不足致命错误

执行ng serve构建浏览器应用包过程中，触发JavaScript堆内存不足的致命错误，垃圾回收机制多次尝试后仍无法完成内存分配，报错核心信息为FATAL ERROR: MarkCompactCollector: young object promotion failed Allocation failed - JavaScript heap out of memory及FATAL ERROR: CALL_AND_RETRY_LAST Allocation failed - JavaScript heap out of memory。

错误日志 #

ng serve
⠴ Generating browser application bundles (phase: building)...
<--- Last few GCs --->

[27248:03EFBAA8]   311252 ms: Mark-sweep (reduce) 1014.2 (1026.2) -> 1013.6 (1027.5) MB, 2168.8 / 0.1 ms  (average mu = 0.074, current mu = 0.009) alloc


<--- JS stacktrace --->

FATAL ERROR: MarkCompactCollector: young object promotion failed Allocation failed - JavaScript heap out of memory

C:\Users\Nimra\Desktop\angular\QA\enableu-app>ng serve
⠴ Generating browser application bundles (phase: building)...
<--- Last few GCs --->

[22980:03E894E0]   171563 ms: Mark-sweep 1016.1 (1032.6) -> 1014.0 (1034.1) MB, 1007.2 / 0.1 ms  (average mu = 0.127, current mu = 0.023) allocation failure scavenge might not succeed
[22980:03E894E0]   173624 ms: Mark-sweep 1018.1 (1042.1) -> 1016.0 (1043.3) MB, 2038.4 / 0.1 ms  (average mu = 0.051, current mu = 0.011) allocation fai

<--- Last few GCs --->

[12044:03E79450]      111 ms: Mark-sweep 1.0 (3.3) -> 1.0 (3.3) MB, 3.2 / 0.0 ms  (average mu = 0.772, current mu = 0.044) allocation failure GC in old space requested
[12044:03E79450]      115 ms: Mark-sweep (reduce) 1.0 (3.3) -> 0.9 (3.3) MB, 3.4 / 0.0 ms  (average mu = 0.647, current mu = 0.185) last resort GC in old space requested
[12044:03E79450]      119 ms: Mark-sweep (reduce) 0.9 (2.3) -> 0.9 (3.3) MB, 4.0 / 0.0 ms  (average mu = 0.463, current mu = 0.014) last resort GC in old space requested


<--- JS stacktrace --->

FATAL ERROR: CALL_AND_RETRY_LAST Allocation failed - JavaScript heap out of memory

已尝试的无效解决方案 #

• 卸载并重装Node.js、Angular CLI及相关组件
• 更新npm及所有依赖
• 从主仓库重新克隆项目
• 通过临时命令尝试增加内存大小

有效解决方案 #

1. 全局配置Node.js内存限制 #

为Node.js设置全局内存上限，避免每次启动单独配置：

• Windows：右键「此电脑」→ 属性 → 高级系统设置 → 环境变量 → 新建系统变量，变量名NODE_OPTIONS，变量值设为--max-old-space-size=4096（值根据可用内存调整，8G内存建议设4096，16G内存可设8192）
• macOS/Linux：终端执行export NODE_OPTIONS="--max-old-space-size=4096"，若需永久生效，将该命令写入~/.bashrc或~/.zshrc文件

2. 单独为Angular CLI启动命令配置内存 #

修改项目根目录package.json，调整serve命令的内存参数：

"scripts": {
  "serve": "node --max-old-space-size=4096 ./node_modules/@angular/cli/bin/ng serve"
}

之后执行npm run serve启动项目即可

3. 优化Angular构建配置降低内存消耗 #

在angular.json中开启构建优化，减少构建时内存占用：

"architect": {
  "build": {
    "options": {
      "optimization": true,
      "aot": true,
      "sourceMap": false
    }
  }
}

• aot：提前编译，减少运行时内存占用
• sourceMap：关闭后可大幅降低构建过程中的内存消耗
• optimization：开启代码优化，缩小打包体积

4. 清理项目缓存 #

执行ng cache clean命令清除Angular CLI缓存，或直接删除项目根目录下的node_modules/.cache文件夹，避免缓存文件占用额外内存

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