这篇文章主要介绍了webpack中的模式(mode)使用详解，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧
模式(mode)
提供 mode 配置选项，告知 webpack 使用相应模式的内置优化。
用法
只在配置中提供 mode 选项：
module.exports = { mode: 'production' };
或者从 CLI 参数中传递：
webpack --mode=production
支持以下字符串值：
1.development
会将 process.env.NODE_ENV 的值设为 development。启用 NamedChunksPlugin 和 NamedModulesPlugin。
// webpack.development.config.js module.exports = { + mode: 'development' - plugins: [ - new webpack.NamedModulesPlugin(), - new webpack.DefinePlugin({ "process.env.NODE_ENV": JSON.stringify("development") }), - ] }
2.production
会将 process.env.NODE_ENV 的值设为 production。启用 FlagDependencyUsagePlugin, FlagIncludedChunksPlugin, ModuleConcatenationPlugin, NoEmitOnErrorsPlugin, OccurrenceOrderPlugin, SideEffectsFlagPlugin 和 UglifyJsPlugin.
// 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() - ] }
production模式下会启用UglifyJsPlugin插件（移除未使用的内容和文件压缩），分别用production和development打包，编译的区别：
1.development打包后，一些没有依赖的方法 变量 文件会保留，production则会移除。
2.production打包后，代码会进行压缩，比development的文件小。
到此这篇关于webpack中的模式(mode)使用详解的文章就介绍到这了,更多相关webpack 模式内容请搜素本站以前的文章或下面相关文章，希望大家以后多多支持本站！
以上就是webpack中的模式(mode)使用详解的详细内容，更多请关注本站其它相关文章！
