Webpack开发服务器监视选项aggregateTimout不起作用

Question

我需要将我的webpack开发服务器延迟十秒钟，以便其他文件准备就绪。

我的配置文件是：

   "devServer": {
    "historyApiFallback": true,
    "hot": false,
    "inline": false,
    "watchOptions": {
        "aggregateTimeout": 10000
    }

据我了解，一旦任何文件更改，webpack服务器应在创建我的捆绑包之前等待十秒钟，但延迟不起作用，一旦我更改文件，webpack便开始捆绑。

有什么建议么 ？:(

Answer 1

我使用 webpack v5 和 dev-server 也遇到了这个问题。

Webpack-dev-server 使用chokidar来监视文件。我发现参数awaitWriteFinish可以解决这个问题。阅读@types\webpack-dev-server\index.d.ts，发现watchFiles可以设置chokidar选项：

   /**
    * This option allows you to configure list of globs/directories/files
    * to watch for file changes.
    */
    watchFiles?: string | string[] | WatchFiles | Array<WatchFiles | string> | undefined;

    interface WatchFiles {
        options?: chokidar.WatchOptions | undefined;
        paths?: string[] | string | undefined;
    }

这个 wepack.config.js 对我有用：

  devServer: {
    static: './dist',
    hot:true,
    open:true,
    watchFiles: {
      options:{
        awaitWriteFinish:{
          stabilityThreshold:2000
        }
      },
      paths:['src/**/*']
    }
  },

我认为aggregateTimeout不行：webpack-dev-server issues #1782