Webpack 模式 mode

Question

通过选择 development (默认), production 、 none 之中的一个，来设置 mode 参数，可以启用 webpack 内置在相应环境下的优化。

在配置对象中提供 mode 选项：

module.exports = {
  mode: 'production'
};

或者从 CLI 参数中传递：

webpack --mode=production

选项	描述
development	会将 DefinePlugin 中 process.env.NODE_ENV 的值设置为 development 。启用 NamedChunksPlugin 和 NamedModulesPlugin 。
production	会将 DefinePlugin 中 process.env.NODE_ENV 的值设置为 。启用 FlagDependencyUsagePlugin , FlagIncludedChunksPlugin , ModuleConcatenationPlugin , NoEmitOnErrorsPlugin , OccurrenceOrderPlugin , SideEffectsFlagPlugin 和 TerserPlugin 。
none	退出任何默认优化选项

注意： 设置 NODE_ENV 并不会自动地设置 mode 。

如果要根据 webpack.config.js ​ 中的 mode 变量更改打包行为，则必须将配置导出为一个函数，而不是导出为一个对象：

var config = {
  entry: './app.js'
  //...
};

module.exports = (env, argv) => {
  if (argv.mode === 'development') {
    config.devtool = 'source-map';
  }
  if (argv.mode === 'production') {
    //...
  }
  return config;
};