webpack打包多入口,大項目時,有時候會報內存溢出的錯誤(FATAL ERROR: CALL_AND_RETRY_LAST Allocation failed - JavaScript heap out of memory),可采用以下步驟來解決問題:
1. 定位問題
可在打包腳本中,加入以下代碼,實時監控內存占用情況
process.memoryUsage()
返回值為:
{
rss: 4935680,
heapTotal: 1826816,
heapUsed: 650472,
external: 49879,
arrayBuffers: 9386
}
單位是字節
heapTotal和heapUsed代表V8的內存使用情況。external代表V8管理的,綁定到Javascript的C++對象的內存使用情況。rss是駐留集大小, 是給這個進程分配了多少物理內存(占總分配內存的一部分),包含所有的C++和JavaScript對象與代碼。arrayBuffers指分配給ArrayBuffer和SharedArrayBuffer的內存,包括所有的Node.js Buffer。 這也包含在external值5. 中。 當Node.js用作嵌入式庫時,此值可能為0,因為在這種情況下可能無法跟蹤ArrayBuffer的分配。
2. 解決問題
查看到webpack所需要的大致內存后,將nodejs可用內存調整至其需要的大小,可通多以下幾種方式調整:
2.1 nodejs執行相關腳本,直接添加--max-old-space-size參數
node --max-old-space-size=8192 index.js
2.2 如果是通過gulp等處理的打包
找到node_modules/.bin/gulp文件,第一行會為#!/usr/bin/env node,在node后面新增--max-old-space-size xxx就好,
比如:
#!/usr/bin/env node --max_old_space_size=8192 // 8192為MB,可修改為自己需要的大小。
2.3 通過設置全局變量解決
# windows
set NODE_OPTIONS=--max_old_space_size=4096
# mac/linux
export NODE_OPTIONS=--max_old_space_size=4096
2.4 選擇npm庫increase-memory-limit
但是作者更推薦使用方式2.3
以上4種方式,都可解決內存溢出問題,可按照相關項目實際情況,選擇合適的方式.
