「npm run production」でエラー（メモリ不足）が出てコンパイル出来ない【#np2020】

今現在のフロントエンドはBootstrapVueで、Laravel Mixを使って

npm run dev

コマンドで開発用コンパイルをして動作チェック、問題なければmasterブランチにマージしてデプロイというかたちになっています。「npm run dev」コマンドは複数のファイルを1つにまとめてくれるんですが、minifyはしません。一方で本番用コンパイルである

npm run production

の方は、まとめた上でminifyしてくれます。どれくらい小さくなるかは環境によると思いますが、僕の環境ではおおむね1/4程度にはなるようです。jsファイルやcssファイルは参照される頻度も高いので、これが小さくなるのはとてもデカい。というわけで、デプロイ前にはそれをしたかったんですが……これまでエラーが出て上手く行かなかったんですね。それがようやく解決出来ましたというお話。

【起きていた問題】メモリエラー

npm run production

を実行すると次の様なエラーが出ます。

FATAL ERROR: Ineffective mark-compacts near heap limit Allocation failed – JavaScript heap out of memory

詳しいことはよくわかりませんが、どうやらメモリが足りないようです。メモリを増やしてビルドを行うオプションを付ければ良いといった情報が見つかりますが、上手く生きませんでした。パッケージのバージョンも最新版。

【解決方法】 Vagrantのメモリを増やした

ローカル環境は「Vagrant+VirtualBox」という定番の環境で動いているのですが、そのVagrantに割り振られているメモリが少なかったんですね。Vagrantはデフォルトで500MBまで確保するということになっているようですが、それが足りなかったと。

というわけで、Vagrantfileのコメントアウトを外してメモリを2,048MBに増やす。

# config.vm.provider "virtualbox" do |vb|
#   Display the VirtualBox GUI when booting the machine
#   vb.gui = true
#
#   Customize the amount of memory on the VM:
#   vb.memory = "1024"
# end

↓

config.vm.provider "virtualbox" do |vb|
#   Display the VirtualBox GUI when booting the machine
#   vb.gui = true
#
#  Customize the amount of memory on the VM:
vb.memory = "2048"
end

これでVagrantを起動し直して、もう一度「npm run production」を実行したら……出来た！

参考）Vagrant&Virtual Box開発環境下でメモリと容量を増やす – Qiita