Question

我为webpack创建了两个配置。

当我导出一系列配置时：一切正常，而不是观看选项。任务完成（成功）。

当我测试一个配置导出时 - watch工作正常。

我尝试了多个入口点，那时候看起来也很好，但是配置看起来有点乱。

我会听取我的意见，希望得到建议，谢谢。

/* FRONT-END CONFIG */
var frontWebpackConfig = {
  entry: "./src/front/app",

  output: {
    path: __dirname + "/build",
    filename: "public/app.js"
  },

  watch: NODE_ENV == "development",

  watchOptions : {
    aggregateTimeout: 100
  },

  devtool : NODE_ENV == "development" ? "cheap-inline-module-source-map" : null,

  plugins : [
    new webpack.NoErrorsPlugin(),
    new webpack.DefinePlugin({
      NODE_ENV : JSON.stringify(NODE_ENV)
    })
  ],

  module : {
    loaders : [
      {
        test : /\.js$/,
        loader : 'babel',
        query: {
          presets: ['es2015']
        }
      },
      { test: /\.css$/, loader: "style-loader!css-loader" }
    ]
  }
};


/* BACK-END CONFIG */
var backWebpackConfig = {
  entry: "./src/back/server",

  target : 'node',

  output: {
    path: __dirname + "/build",
    filename: "server.js"
  },

  externals: nodeModules,

  watch: NODE_ENV == "development",

  watchOptions : {
    aggregateTimeout: 100
  },

  devtool : NODE_ENV == "development" ? "cheap-inline-module-source-map" : null,

  plugins : [
    new webpack.NoErrorsPlugin(),
    new webpack.DefinePlugin({
      NODE_ENV : JSON.stringify(NODE_ENV)
    })
  ],

  module : {
    loaders : [
      {
        test : /\.js$/,
        loader : 'babel',
        query: {
          presets: ['es2015']
        }
      }
    ]
  }
}


/* EXPORTS */
module.exports = [frontWebpackConfig, backWebpackConfig]

另外，我已经解释了这个表达式：“NODE_ENV ==”development“”值，并尝试直接设置为true。

更新：有趣的是，我刚尝试在命令行中使用“--watch”选项启动它并且运行正常。任何想法为什么文件配置不起作用？

Answer 1

watch isn't a configuration option in Webpack。正如您所建议的那样，您需要在CLI上传递它，或者在使用Node API时调用watch而不是run：

compiler.watch({ ...watchOptions }, function(err, stats) {
    // ...
});

Answer 2

实际上，是watch中webpack 1.13.0+的一个选项。

但似乎，如果有多个配置（对象数组）watch属性应该设置为数组以使其工作。最终将使用第一个配置对象的watchOptions属性。

/* FRONT-END CONFIG */
var frontWebpackConfig = {
    entry: "./src/front/app",
    // ...
    watch: NODE_ENV == "development",
    watchOptions : {
        aggregateTimeout: 100,
    },
};

/* BACK-END CONFIG */
var backWebpackConfig = {
    entry: "./src/back/server",
    // ...
};

var configuration = [frontWebpackConfig, backWebpackConfig];
configuration.watch = true;

/* EXPORTS */
module.exports = configuration;

命令行中的

--watch参数只是在配置加载和处理期间将watch属性设置为数组，这就是使用CLI参数按预期工作的原因。

多配置期间的webpack监视选项

2 个答案: