ビルド時にFATAL ERROR: Ineffective mark-compacts near heap limit Allocation failed - JavaScript heap out of memory

トラブルシューティング
#1

Ionic4、Angular8で開発を行っております。

下記のコマンドでビルドした際に、タイトルのエラーが発生しております。

ionic cordova build browser --prod

同様の報告がこちらのissueでも報告されておりましたので、下記の通り、package.json内のscriptsを修正してみたのですが、状況は変わらずです。

  "scripts": {
    "ng": "ng",
    "start": "ionic serve",
    "build": "node --expose-gc --max_old_space_size=10240 ./node_modules/.bin/ionic cordova build browser --prod",
    "test": "ng test",
    "lint": "ng lint",
    "e2e": "ng e2e"
  },

同様の課題をクリアされた方がいらっしゃいましたら、解決方法を教えていただければ幸いです。

下記が、ionic infoの内容になります。

Ionic:

   Ionic CLI                     : 5.4.1
   Ionic Framework               : @ionic/angular 4.10.0
   @angular-devkit/build-angular : 0.801.3
   @angular-devkit/schematics    : 8.3.6
   @angular/cli                  : 8.3.6
   @ionic/angular-toolkit        : 2.0.0

Capacitor:

   Capacitor CLI   : 1.1.1
   @capacitor/core : 1.1.1

Cordova:

   Cordova CLI       : 8.0.0
   Cordova Platforms : none
   Cordova Plugins   : no whitelisted plugins (0 plugins total)

Utility:

   cordova-res : not installed
   native-run  : 0.2.8

System:

   NodeJS : v10.15.1
   npm    : 6.10.1
   OS     : macOS Mojave
   Xcode  : Xcode 10.3 Build version 10G8
「いいね！」 1
#2

お疲れ様です。
ionic cordova build browser --prod なのですが、CLIの内部的な動きとしては

ng build --prod
+
cordova build browser

です。エラーをみると、メモリ制限にひっかかってるようなので、1コマンドで実行しようとせずに、コマンドを分割して実行を試してみるといいと思います。また、マシンの問題なので、CircleCIなどにビルドを投げてしまうというのもひとつかと思いますー！

ただ、「PWAではCordova browserを使うべきか」という議論はIonicのIssuesでも時々議論になっていまして、

  1. Cordovaはbrowser対応していないプラグインが多い
  2. scriptでの呼び出しファイルが増える
  3. browser対応してるプラグインはグローバルでDOM操作を行うので速くない

こともあり、個人的にはおすすめしていない事情もあります。もしもクリティカルな問題がなければ、Cordova自体を外してしまうというのもありかと思います。

以上、参考になりましたら幸いです。

「いいね！」 1
#3

補足なのですが、Ionic teamのMikeから「Cordova browserはもともとデバイステストをブラウザで簡単にするためのものだった」とリプライいただいたので、共有しておきますー！

「いいね！」 1
#4

ご回答いただき、ありがとうございます！

Cordova browserの件は個人的には深くまで知ることができて面白い話ですが、
プロジェクト的にクリティカルな部分になるので、今回はビルドのみ解決したいと思います！

ビルドについては、
最終的に下記の流れでコマンドを分割することで成功しました。
node --expose-gc --max_old_space_size=10240 ./node_modules/.bin/ng build --prod cordova
+
cordova build browser

マシンスペックに関して、加えてご質問させていただきたいのですが、
使用しているモジュールにもよりそうですが、ビルドにはどの程度のスペックが必要でしょうか。

今回、AWSのCodeBuildを使用してng build --prodを実行した際に今回のエラーが発生しましたので、ローカルで同じビルドを試したという経緯がございます。
※CodeBuildのマシンスペックは4 vCPU, 7GB memory

#5

無事ビルドに成功できてよかったです。やはり ng build 自体への割当メモリが足りなかったようですね。

ビルドのCIでは、私はCircleCI / Netlifyを無料プランで利用しておりますが、ここ最近、そのようなエラーに遭遇してないのでちょっと何ともいいにくいところです（CircleCIは4GB memory）。AWSの場合は内部的なメモリの割当の問題でしょうか。
ローカル開発環境においては、快適に開発するためには最低メモリ16GB欲しいねという話は時々しておりますー。

「いいね！」 1
#6

ご回答いただき、ありがとうございます！
CircleCIとローカル開発時の最低メモリの目安について、参考にさせていただきます！

ちなみに、私が使用しているマシンはメモリ32GBで、本件以外は快適に開発できているのですが、ng buildをそのまま実行するとでエラーが…という状態です。

ご回答いただいた内容を解決策にさせていただきます！

「いいね！」 1