VUEホットアップデートメモリオーバーフローの解決策

2093 ワード
VUE
開発プロジェクトはしばらくの間、プロジェクトが大きくなるにつれて、パッケージの時間も長くなり、パッケージのメモリも増えました.このとき、プロジェクトをパブリッシュするときに、次のようなエラーのヒントが表示されるという問題が発生しました.



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

    0: ExitFrame [pc: 3295209E]
    1: StubFrame [pc: 32946989]
Security context: 0x0f312701 
    2: replace [0F30B631](this=0x3ec73a65 ,0x1334c6a5

理由は分かりにくいですが、NodeでJavaScriptを介してメモリを使用する場合は一部のメモリ(64ビットシステム:1.4 GB、32ビットシステム:0.7 GB)しか使用できません.この場合、フロントエンドプロジェクトが非常に膨大であれば、Webpackコンパイル時に多くのシステムリソースを占有し、V 8エンジンを超えてNodeのデフォルトのメモリ制限が大きい場合、メモリオーバーフローエラーが発生します.
個人的にもいくつかのブログを調べましたが、packagejsonでdevを以下のように修正したということが多いです.

"scripts": {
    "dev": "node --max-old-space-size=8192 build/dev.js"
  },

しかし、私はwebpack-dev-serviceで起動したテスト環境を使用しているので、このように修正することはできません.最終的にはプロジェクトの起動が開始できません.根本的な原因は、まだ何か修正する必要があるのか、それとも直接このように変更することはできません.
最後に、packagejsonにこの2つのプラグインを追加する別の修正方法が見つかりました.
"dependencies": {
    "increase-memory-limit": "^1.0.3",
    "cross-env": "^5.0.5"
  },

npm installを実行してコンポーネントをインストール
次に、次のように追加します.
"scripts": {
    "fix-memory-limit": "cross-env LIMIT=3072 increase-memory-limit"
  },

LIMITは、割り当てたいメモリサイズで、npm run fix-memory-limitを実行します.
一度だけ実行してプロジェクトを再起動すると、ホットアップデートでメモリがオーバーフローしません.
Netty-啓蒙からレンガ運搬まで(完全応用編)(フロントエンドVue編)
Vue.jsステップ【2-1】Vue Loader管理シングルファイルコンポーネントfile.vue