Laravel 混合观看模式下的无限重建循环答案

【问题标题】：Infinite rebuild loop in Laravel mix watch modeLaravel 混合观看模式下的无限重建循环
【发布时间】：2020-04-19 14:23:47
【问题描述】：

在 Xubuntu 18.04 下使用 PhpStorm 2020.1，我正在将 JS 游戏构建到 Laravel 6.18.8 全新安装中。

每次我运行 npm run watch 或 npm run watch-poll 时，我的资产都会无限重建。

这是我的配置：

// Dependencies in package.json:
"devDependencies": {
    "axios": "^0.19",
    "bootstrap": "^4.4.1",
    "cross-env": "^7.0",
    "fibers": "^4.0.2",
    "jquery": "^3.5.0",
    "laravel-mix": "^5.0.1",
    "lodash": "^4.17.13",
    "node-sass": "^4.13.1",
    "pixi.js": "^5.2.1",
    "popper.js": "^1.16.1",
    "resolve-url-loader": "^3.1.0",
    "sass": "^1.15.2",
    "sass-loader": "^8.0.0",
    "vue-template-compiler": "^2.6.11"
  }

// webpack.mix.js config:
mix
    .copyDirectory('resources/images', 'public/images')
    .sass('resources/sass/app.scss', 'public/css')
    .js('resources/js/app.js', 'public/js')
    .extract(['lodash', 'popper.js', 'jquery', 'bootstrap', 'axios', 'pixi.js'])
    .version(['public/images'])
    .sourceMaps()
;

我用谷歌搜索了很多，主要是找到this solution，但更改processCssUrls 选项并没有改变任何东西。
请注意，我的应用程序图像都不是来自任何 scss 文件，所以我不要认为这是重写 url 的问题。

深入挖掘，我也使用了以下插件，看看哪个文件触发了重建：

class WatchRunPlugin {
    apply(compiler) {
        compiler.hooks.watchRun.tap('WatchRun', (comp) => {
            let mtimes = comp.watchFileSystem.watcher.mtimes;
            let changes = Object.keys(mtimes);
            if (changes.length) {
                changes = changes.map(file => `  ${file} (${mtimes[file]})\n`).join('');
                console.log(`CHANGES:\n${changes}`);
            }
        });
    }
}

在每次重建时，它只显示带有新时间戳的 /public/mix-manifest.json，就好像此文件更新触发了重建一样。
我试图忽略它，但这也不会改变任何东西；

mix
    .webpackConfig({
        watchOptions: {
            ignored: ['public/mix-manifest.json']
        }
    })
    // ...
    ;

最后，我尝试从webpack.mix.js 中删除每一条语句，但无论定义的重建任务如何，问题仍然存在。这个问题可能是由操作系统和/或 IDE 引起的吗？

这让我发疯了，我的选择已经不多了^^
任何帮助将不胜感激，在此先感谢。

编辑

我正在将/public/mix-manifest.json 导入到我的脚本中（认为将其用作我的游戏的资产清单很聪明）。
所以每次创建manifest都会触发rebuild，然后manifest又被创建，然后……无限循环！

将其更改为适当且专用的方法来管理游戏资产清单，现在一切正常。
愚蠢，但花了我一些时间来弄清楚......

【问题讨论】：

标签： laravel ubuntu webpack infinite-loop laravel-mix

【解决方案1】：

如果你还没有弄清楚。尝试禁用 PhpStorm 的“自动保存”。每次您在 IDE 中编写内容时，它都会自动保存它，这会导致资产一次又一次地重新编译。

Open PhpStorm settings (Command + , on Mac) > 
Appearance & Behaviour > 
System Settings > 
uncheck "Save files on frame deactivation" and "Save files automatically if application is idle for ..."

【讨论】：