angular4 JavaScript內存溢出問題 (FATAL ERROR: CALL_AND_RETRY_LAST Allocation failed - JavaScript heap out

最近在寫基於angular4的項目的時候,在build --prod的時候,忽然措手不及的蹦出個報錯,大體錯誤以下:node

70% building modules 1345/1345 modules 0 active
<--- Last few GCs --->

  317945 ms: Mark-sweep 703.9 (837.9) -> 701.4 (811.9) MB, 331.3 / 0 ms [allocation failure] [GC in old space requested].
  318296 ms: Mark-sweep 701.4 (811.9) -> 701.4 (790.9) MB, 350.5 / 0 ms [allocation failure] [GC in old space requested].
  318730 ms: Mark-sweep 701.4 (790.9) -> 698.0 (760.9) MB, 433.7 / 0 ms [last resort gc].
  319058 ms: Mark-sweep 698.0 (760.9) -> 692.7 (751.9) MB, 328.7 / 0 ms [last resort gc].


<--- JS stacktrace --->

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

Security context: 00000298510373A9 <JS Object>
    1: /* anonymous */(aka /* anonymous */) [D:\dev\cobalt_wp\node_modules\webpack\lib\FlagDependencyExportsPlugin.js:77] [pc=0000026F721B51D6] (this=0000029851004131 <undefined>,dep=00000150FC6162C9 <a NormalModule with map 0000025741730C01>)
    2: arguments adaptor frame: 3->1
    3: InnerArrayForEach(aka InnerArrayForEach) [native array.js:~924] [pc=0000026F71EE3DCD] (this=000002985100413...

FATAL ERROR: CALL_AND_RETRY_LAST Allocation failed - process out of memory

注:這裏的代碼並非個人真實報錯代碼,編譯時間太長,忘記截取了,大體的錯誤基本同樣,若是你遇到了相同的問題,恭喜了,往下看能找到答案!webpack

當時我是蒙圈了,一直都編譯的挺好,怎麼忽然就溢出了呢?web

可能的緣由有以下:angular4

1.angular4 在編譯的時候,對CPU和內存的需求比較大,當文件數量不少的時候,可能會出現內存不足的狀況(有可能);大數據

2.當代碼出現大量大數據的循環或者死循環(sever階段並無出現溢出,這個機率應該不大);ui

3.angular訂閱的數據在 ngOnDestroy 階段沒有被銷燬,形成大量數據佔用內存(有可能)this

 

目前沒有查到具體是什麼緣由形成的,哪位大神知道的,請不吝賜教,謝謝!spa

解決這個問題的過程很波折,這裏就不說了,大家估計也不想知道,下面說一下解決方案吧:code

核心思路是運用v8引擎的舊屬性: --max_old_space_size 來修改內存上線,至於這個屬性在哪裏設,就是一個磨人的小妖精了!orm

修改目錄:  my-project/node_modules/.bin  找到 ng.cmd :

@IF EXIST "%~dp0\node.exe" (
  "%~dp0\node.exe" --max_old_space_size=8192  "%~dp0\..\._@angular_cli@1.0.0@@angular\cli\bin\ng" %*
) ELSE (
  @SETLOCAL
  @SET PATHEXT=%PATHEXT:;.JS;=;%
  node --max_old_space_size=8192  "%~dp0\..\._@angular_cli@1.0.0@@angular\cli\bin\ng" %*
)

 

修改目錄: my-project/node_modules/.bin  找到 ngc.cmd :

@IF EXIST "%~dp0\node.exe" (
  "%~dp0\node.exe" --max_old_space_size=8192  "%~dp0\..\._@angular_compiler-cli@4.0.1@@angular\compiler-cli\src\main.js" %*
) ELSE (
  @SETLOCAL
  @SET PATHEXT=%PATHEXT:;.JS;=;%
  node --max_old_space_size=8192  "%~dp0\..\._@angular_compiler-cli@4.0.1@@angular\compiler-cli\src\main.js" %*
)

 

看到裏面的--max_old_space_size設置了嗎? 至於數字設多少,大家本身看着辦吧,個人項目比較大,設個大點的值,以防不測,哈哈!

而後執行 ng build --prod ,你覺得這樣就好了嗎?這纔是關鍵的地方!

本人親測,如上設置,再執行編譯依然會報內存溢出,貌似並沒什麼卵用!把當前目錄切換到 my-project/node_modules/.bin 而後再執行 ng build --prod , 世界一會兒就和平了! 本人親測有效,收好不謝!

若是你想問,爲何不加 --aot , 這個就留個你本身先想一想吧!

好了,忙裏抽閒,分享一下這個大坑的填坑方法, 但願對你們有用!

原創不易,如需轉載,請註明出處! 謝謝!

相關文章
相關標籤/搜索