ホームページ  >  記事  >  ウェブフロントエンド  >  angular4 での JS メモリ オーバーフローの問題を解決する方法

angular4 での JS メモリ オーバーフローの問題を解決する方法

php中世界最好的语言
php中世界最好的语言オリジナル
2018-04-11 17:07:522054ブラウズ

今回はangular4でのJSメモリオーバーフロー問題を解決する方法を紹介します。angular4でJSメモリオーバーフロー問題を解決するための注意点は何ですか?以下は実際的なケースです、見てみましょう。 最近、angular4 に基づいてプロジェクトを作成しているときに、--prod をビルドするときに、突然次のようなエラーが発生しました。

70% building modules 1345/1345 modules 0 active
<--- Last few GCs --->
ms: Mark-sweep 703.9 (837.9) -> 701.4 (811.9) MB, 331.3 / 0 ms [allocation failure] [GC in old space requested].
ms: Mark-sweep 701.4 (811.9) -> 701.4 (790.9) MB, 350.5 / 0 ms [allocation failure] [GC in old space requested].
ms: Mark-sweep 701.4 (790.9) -> 698.0 (760.9) MB, 433.7 / 0 ms [last resort gc].
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

注: ここのコードは実際のエラー コードではありません。コンパイル時間が長すぎたので、それをインターセプトするのを忘れました。同じ問題が発生した場合は、以下を読むと解決策が見つかります。

当時は混乱していました、コンパイルはいつも順調に進んでいたのに、なぜ突然オーバーフローしたのですか?

考えられる理由は次のとおりです:

1. angular4 はコンパイル時に CPU とメモリを比較的多く要求します。ファイルの数が多い場合、メモリが不足する可能性があります。

2. コードに

ループ

または大量のビッグデータを含む無限ループがある場合 (サーバー段階でオーバーフローがないため、この可能性は低いはずです )。 3. angular によってサブスクライブされたデータは ngOnDestroy ステージで破棄されないため、大量のデータがメモリを占有します (可能性があります)

詳しい原因はまだわかっていないので教えてください

この問題を解決するプロセスは非常に複雑なので、ここでは触れません。おそらく知りたくないでしょう。以下で解決策について話しましょう。 中心となるアイデアは、v8 エンジン

の古い

属性を使用することです: --max_old_space_size を使用して、この属性をどこに設定するかについては、面倒な問題です

。 ディレクトリを変更します: 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 を実行すると、世界が突然平和になります ! 私が個人的にテストしたので、そのままにしておいてください

この記事の事例を読んだ後は、この方法を習得したと思います。 php 中国語 Web サイトの他の関連記事にも注目してください。

推奨読書:

vue が xe-utils 関数ライブラリを使用する手順の詳細な説明

プロジェクトをパッケージ化した後に Vue が更新されて 404 が表示される場合の 404 への対処方法

以上がangular4 での JS メモリ オーバーフローの問題を解決する方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。