laravel npm run watchのコンパイルを最適化したい

Question

前提・実現したいこと

laravel5.8
vagrant
homestead

laravelでwebサイトを練習で作っていますが、npm run watchとnpm run devが非常に遅く、不便で困っています。
そしてnpm run watch で監視しているにもかかわらず、app.scssで書いたコードが、リロードした後も読み込まれていません。

なので、すぐにnpm run watchもしくは　npm run devをしないとapp.scssがapp.cssに読み込まれません。

ちなみに、macを使っていて、このlaravelでの開発中は常にファンが回っていてます。コンピューターに負荷がかかっているという事でしょうか？

もしそうなら、それが原因で　npm run watchが　app.scssからapp.cssにコンパイルするのが遅かったり、監視しているにもかかわらずブラウザに反映されていないという事でしょうか？

laravelの最適化？（負荷を少なくする）が調べてもわからなかったので、詳しい方アドバイスをお願いしたいです。

Answer 1

vagrant の環境下ではnpm run watchは使えないらしいので、代わりにnpm run watch-pollを使う必要があるそうです。

Answer 2

watchで、ファイルを保存するたびにコンパイルしてファイル出力していますか？
だとすれば負荷はかかっていると思います。

neginattofanさんの開発環境がキチンと把握できていないので、
正確なことは言えずなのですが、

私はWebpack Dev Serverを使用しています。
https://webpack.js.org/guides/development/#using-webpack-dev-server

「webpack-dev-serverは、コンパイル後に出力ファイルを書き込みません。代わりに、バンドルファイルをメモリに保持し、サーバーのルートパスにマウントされた実際のファイルであるかのように処理します。」

とあるのですが、

` mode: 'development'の際にはメモリ上のバンドルが使用され、
ファイルを出力しないので、パフォーマンスが向上します。

Comments

[neginattofan]

ありがとうございます。homesteadとvagrantを使って仮想環境で開発していましたが、
npm run hot
を入力すると、localhost:8000が使えるようになり、そこではリロードすると、app.scssが反映されていました。
わかる範囲でお答えいただくとありがたいのですが、仮想環境上で行っていたにもかかわらず、なぜlocalhostなのでしょうか？

[neginattofan]

追記
npm run hot を使っていても、npm run watchのようにリロードしてもapp.scssが反映されなくなりました。。

[退会済みユーザー]

>localhost:8000が使えるようになり
それがWebpack Dev Serverですね、、、

>localhost:8000が使えるようになり、そこではリロードすると、app.scssが反映されていました。
↓
>npm run hot を使っていても、npm run watchのようにリロードしてもapp.scssが反映されなくなりました。。
何か変更してそうなりましたか？

↓このあたりは理解されていますか？
`npm run 〇〇`とターミナルで打つと`package.json`に記述しているエイリアスが実行る。
Webpackを使っているので、`webpack.config.js`に記載された処理が実行される。