对webpack的初步研究4

Mode

              string

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

webpack --mode=production

The following string values are supported:

Option

Description

development

Sets  process.env.NODE_ENV on  DefinePlugin to value  development. Enables  NamedChunksPlugin and  NamedModulesPlugin.

production

Sets  process.env.NODE_ENV on  DefinePlugin to value  production. Enables  FlagDependencyUsagePlugin,  FlagIncludedChunksPlugin,  ModuleConcatenationPlugin,  NoEmitOnErrorsPlugin,  OccurrenceOrderPlugin,  SideEffectsFlagPlugin and  UglifyJsPlugin.

none

Opts out of any default optimization options

If not set, webpack sets production as the default value for mode. The supported values for mode are:

Please remember that setting  NODE_ENV doesn't automatically set  mode.

// webpack.development.config.js
module.exports = {
+ mode: 'development'
- devtool: 'eval',
- plugins: [
-   new webpack.NamedModulesPlugin(),
- new webpack.NamedChunksPlugin(), - new webpack.DefinePlugin({ "process.env.NODE_ENV": JSON.stringify("development") }), - ] }

Mode: production 

// webpack.production.config.js
module.exports = {
+  mode: 'production',
-  plugins: [
-    new UglifyJsPlugin(/* ... */),
-    new webpack.DefinePlugin({ "process.env.NODE_ENV": JSON.stringify("production") }),
- new webpack.optimize.ModuleConcatenationPlugin(), - new webpack.NoEmitOnErrorsPlugin() - ] }

Mode: none 

// webpack.custom.config.js
module.exports = {
+  mode: 'none',
-  plugins: [
-  ]
}

f you want to change the behavior according to the mode variable inside the webpack.config.js, you have to export a function instead of an object:

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