Laravel 5.8修改app.js需重复执行npm run watch的问题求助

嘿，我太懂每次改完app.js都得重新跑npm run watch的烦躁了——毕竟这个命令本来就是用来自动监听文件变更、实时编译的嘛！咱们一步步排查解决：

1. 先确认watch进程是否在持续运行 #

npm run watch启动后，千万别关掉终端窗口，也别中途用Ctrl+C终止进程。正常启动后，终端会显示类似webpack is watching the files…的提示，这才说明它在后台乖乖监听呢。如果进程断了，自然没法响应文件变化。

2. 检查webpack.mix.js配置是否正确 #

打开项目根目录的webpack.mix.js，确保你的Vue入口文件配置没出错，比如：

mix.js('resources/js/app.js', 'public/js')
   .sass('resources/sass/app.scss', 'public/css');

要是你把app.js的路径写错了，Mix根本监听不到它的变化。另外也别不小心加了自定义的忽略规则，把resources/js目录排除在外了。

3. 试试npm run watch-poll替代普通watch #

有些场景下（比如用虚拟机、共享目录，或者某些Linux发行版），系统原生的文件监听机制会失效。这时候可以用轮询模式：

npm run watch-poll

它会每隔一小段时间主动检查文件变化，虽然比原生监听多占点资源，但能解决绝大多数监听失效的问题。

4. 清除缓存并重装依赖试试 #

缓存损坏或者依赖包出问题也可能导致这个情况，按下面的步骤操作：

• 先停掉当前的watch进程（按Ctrl+C）
• 删除node_modules目录：rm -rf node_modules（Windows系统用rmdir /s /q node_modules）
• 删除package-lock.json文件：rm package-lock.json
• 重新安装依赖：npm install
• 再次启动watch：npm run watch

5. 确认你修改的是源文件 #

别不小心改了public/js/app.js哦！这个是编译后的产物，Mix不会监听它的变化，而且下次编译还会被覆盖。一定要修改resources/js/app.js这个源文件才行。

另外看你页面里的<articles></articles>组件引用是正常的，只要组件已经在app.js里正确注册了，解决监听问题后，修改组件或者app.js的内容都会自动触发编译刷新。

试试上面的方法，应该就能摆脱手动重启watch的麻烦啦！

内容的提问来源于stack exchange，提问作者Brian May