模式(mode) | webpack 中文网

提供 mode 配置选项，告知webpack 使用相应模式的内置优化。

... webpack.development.config.js module.exports = { + mode: 'development' - plugins: [ - new ... Home对比|webpack中文网品牌指南|webpack中文网概念术语|webpack中文网遵循许可|webpack中文网概念入口起点(entrypoints)|webpack中文网输出(output)|webpack中文网模式(mode)|webpack中文网loader|webpack中文网插件(plugins)|webpack中文网配置(configuration)|webpack中文网模块(modules)|webpack中文网模块解析(moduleresolution)|webpack中文网依赖图(dependencygraph)|webpack中文网manifest|webpack中文网构建目标(targets)|webpack中文网模块热替换(hotmodulereplacement)|webpack中文网配置使用不同语言进行配置(configurationlanguages)|webpack中文网多种配置类型(configurationtypes)|webpack中文网入口和上下文(entryandcontext)|webpack中文网输出(output)|webpack中文网模块(module)|webpack中文网解析(resolve)|webpack中文网插件(plugins)|webpack中文网开发中Server(devServer)|webpack中文网devtool|webpack中文网构建目标(targets)|webpack中文网watch和watchOptions|webpack中文网外部扩展(externals)|webpack中文网性能(performance)|webpack中文网Node|webpack中文网统计信息(stats)|webpack中文网其它选项(otheroptions)|webpack中文网API命令行接口(commandlineinterface)|webpack中文网包含统计数据的文件(statsdata)|webpack中文网Node.jsAPI|webpack中文网模块热替换(hotmodulereplacement)|webpack中文网loaderAPI|webpack中文网模块方法(modulemethods)|webpack中文网模块变量(modulevariables)|webpack中文网PluginAPI|webpack中文网compiler钩子|webpack中文网compilation钩子|webpack中文网resolver|webpack中文网parser|webpack中文网指南安装|webpack中文网起步|webpack中文网管理资源|webpack中文网管理输出|webpack中文网开发|webpack中文网模块热替换|webpack中文网treeshaking|webpack中文网生产环境构建|webpack中文网代码分离|webpack中文网懒加载|webpack中文网缓存|webpack中文网创建library|webpack中文网shimming|webpack中文网渐进式网络应用程序|webpack中文网TypeScript|webpack中文网迁移到新版本|webpack中文网使用环境变量|webpack中文网构建性能|webpack中文网内容安全策略|webpack中文网开发-Vagrant|webpack中文网管理依赖|webpack中文网公共路径(publicpath)|webpack中文网集成(integrations)|webpack中文网插件AggressiveSplittingPlugin|webpack中文网ZopfliWebpackPlugin|webpack中文网BannerPlugin|webpack中文网ClosureWebpackPlugin|webpack中文网CommonsChunkPlugin|webpack中文网ComponentWebpackPlugin|webpack中文网CompressionWebpackPlugin|webpack中文网ContextReplacementPlugin|webpack中文网CopyWebpackPlugin|webpack中文网DefinePlugin|webpack中文网DllPlugin|webpack中文网EnvironmentPlugin|webpack中文网EvalSourceMapDevToolPlugin|webpack中文网ExtractTextWebpackPlugin|webpack中文网HashedModuleIdsPlugin|webpack中文网模块热替换插件(HotModuleReplacementPlugin)|webpack中文网HtmlWebpackPlugin|webpack中文网BabelMinifyWebpackPlugin|webpack中文网IgnorePlugin|webpack中文网LimitChunkCountPlugin|webpack中文网LoaderOptionsPlugin|webpack中文网MinChunkSizePlugin|webpack中文网ModuleConcatenationPlugin|webpack中文网NamedModulesPlugin|webpack中文网NoEmitOnErrorsPlugin|webpack中文网NormalModuleReplacementPlugin|webpack中文网NpmInstallWebpackPlugin|webpack中文网PrefetchPlugin|webpack中文网ProfilingPlugin|webpack中文网ProvidePlugin|webpack中文网SourceMapDevToolPlugin|webpack中文网SplitChunksPlugin|webpack中文网UglifyjsWebpackPlugin|webpack中文网WatchIgnorePlugin|webpack中文网I18nWebpackPlugin|webpack中文网loadersbabel-loader|webpack中文网yaml-frontmatter-loader|webpack中文网cache-loader|webpack中文网coffee-loader|webpack中文网coffee-redux-loader|webpack中文网coverjs-loader|webpack中文网css-loader|webpack中文网exports-loader|webpack中文网expose-loader|webpack中文网extract-loader|webpack中文网file-loader|webpack中文网gzip-loader|webpack中文网html-loader|webpack中文网i18n-loader|webpack中文网imports-loader|webpack中文网istanbul-instrumenter-loader|webpack中文网jshint-loader|webpack中文网json-loader|webpack中文网json5-loader|webpack中文网less-loader|webpack中文网bundle-loader|webpack中文网multi-loader|webpack中文网node-loader|webpack中文网null-loader|webpack中文网polymer-webpack-loader|webpack中文网postcss-loader|webpack中文网raw-loader|webpack中文网react-proxy-loader|webpack中文网restyle-loader|webpack中文网sass-loader|webpack中文网script-loader|webpack中文网source-map-loader|webpack中文网style-loader|webpack中文网svg-inline-loader|webpack中文网thread-loader|webpack中文网transform-loader|webpack中文网url-loader|webpack中文网val-loader|webpack中文网worker-loader|webpack中文网mocha-loader|webpack中文网贡献参与中文文档翻译的全体成员|webpack中文网作者指引|webpack中文网编写一个loader|webpack中文网编写一个插件|webpack中文网插件模式|webpack中文网发布流程|webpack中文网调试|webpack中文网voteorganizationstarter-kits概念入口(entry)出口(output)loader插件(plugins)模式入口起点(entrypoints)单个入口（简写）语法对象语法常见场景分离应用程序(app)和第三方库(vendor)入口多页面应用程序输出(output)用法(Usage)多个入口起点高级进阶模式(mode)用法mode:developmentmode:productionloader示例使用loader配置[Configuration]内联CLIloader特性解析loader插件(plugins)剖析用法配置NodeAPI配置(configuration)基本配置多个Target使用其他配置语言模块(modules)什么是webpack模块支持的模块类型模块解析(moduleresolution)webpack中的解析规则绝对路径相对路径模块路径解析Loader(ResolvingLoaders)缓存依赖图(dependencygraph)manifestRuntimeManifest问题构建目标(targets)用法多个Target资源模块热替换(hotmodulereplacement)这一切是如何运行的？在应用程序中在编译器中在模块中在HMRRuntime中入门模式(mode)查看原文|编辑此页提供mode配置选项，告知webpack使用相应模式的内置优化。

string 只在配置中提供mode选项： module.exports={ mode:'production' }; 或者从CLI参数中传递： webpack--mode=production 支持以下字符串值： 选项描述 选项 development 描述 会将process.env.NODE_ENV的值设为development。

启用NamedChunksPlugin和NamedModulesPlugin。

选项 production 描述 会将process.env.NODE_ENV的值设为production。

启用FlagDependencyUsagePlugin,FlagIncludedChunksPlugin,ModuleConcatenationPlugin,NoEmitOnErrorsPlugin,OccurrenceOrderPlugin,SideEffectsFlagPlugin和UglifyJsPlugin. 记住，只设置NODE_ENV，则不会自动设置mode。

//webpack.development.config.js module.exports={ +mode:'development' -plugins:[ -newwebpack.NamedModulesPlugin(), -newwebpack.DefinePlugin({"process.env.NODE_ENV":JSON.stringify("development")}), -] } //webpack.production.config.js module.exports={ +mode:'production', -plugins:[ -newUglifyJsPlugin(/*...*/), -newwebpack.DefinePlugin({"process.env.NODE_ENV":JSON.stringify("production")}), -newwebpack.optimize.ModuleConcatenationPlugin(), -newwebpack.NoEmitOnErrorsPlugin() -] } 贡献人员EugeneHlushko