Providing the mode
configuration option tells webpack to use its built-in optimizations accordingly.
string
Possible values formode
are:none
,development
orproduction
(default).
Just provide the mode
option in the config:
module.exports = { mode: 'production' };
or pass it as a CLI argument:
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 settingNODE_ENV
doesn't automatically setmode
.
// 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") }), - ] }
// 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() - ] }
// webpack.custom.config.js module.exports = { + mode: 'none', - plugins: [ - ] }
If 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; };
© JS Foundation and other contributors
Licensed under the Creative Commons Attribution License 4.0.
https://webpack.js.org/concepts/mode