問題
npm run watch
でファイル修正・保存した箇所をブラウザ上で確認したいができない。
再コンパイルが起きていない模様。
対策
npm run watch-poll
を使う。
使用している環境によっては、npm run watch
が正しく動作しないことがあるようです。
補足
npm run watch
とnpm run watch-poll
の違い。
npm run watch
: ファイルの変更をみている。 (特定の環境の場合は上手くいかない)
npm run watch-poll
: 変更を 1秒単位などで定期的に確認をする。
※watch:ファイルを監視し、ファイルの変更があった時に差分だけをトランスパイル先に
アップロードしてくれる。
package.json
"scripts": {
"dev": "npm run development",
"development": "mix",
"watch": "mix watch",
"watch-poll": "mix watch -- --watch-options-poll=1000", -①
"hot": "mix watch --hot",
"prod": "npm run production",
"production": "mix --production",
"start": "webpack -w --config webpack.dev.config",
"build": "webpack --config webpack.pro.config"
}
①"–watch-options-poll=1000"オプションが追加されていて、1000ミリ秒(1秒)ごとに
ファイルの変更を強制的に見にいくという動作をする。
使っているPCのスペックによっては1秒ごとだと、負荷が重い可能性があるので、
適宜秒数は変えましょう。 (下記サイトが非常にわかりやすいです。)
Laravel-mixのnpm watch-pollのcpu負荷が重いのでwatch-pollの間隔を変える
参考文献