1
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 1 year has passed since last update.

【Laravel×React】npm run watchでファイルの修正が反映されない

Last updated at Posted at 2022-11-28

問題

npm run watchでファイル修正・保存した箇所をブラウザ上で確認したいができない。
再コンパイルが起きていない模様。

対策

npm run watch-pollを使う。

使用している環境によっては、npm run watchが正しく動作しないことがあるようです。

補足

npm run watchnpm 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の間隔を変える

参考文献

1
0
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
1
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?