process.env.NODE_ENV的理解

Posted 2023-02-16

参考技术A

首先在webpack4及以上的版本中，需要指定mode参数

如果不指定，则会默认为production
如果参数值不是上面的其中一个，启动项目则会失败
有两种方式配置：

或者在命令行指定

mode为development的时候，会将 process.env.NODE_ENV 的值设为 development。启用 NamedChunksPlugin 和 NamedModulesPlugin插件。

mode为production的时候，会将 process.env.NODE_ENV 的值设为 production。启用 FlagDependencyUsagePlugin, FlagIncludedChunksPlugin, ModuleConcatenationPlugin, NoEmitOnErrorsPlugin, OccurrenceOrderPlugin, SideEffectsFlagPlugin 和 UglifyJsPlugin插件

-----------------------------分割线---------------------------------

不过在webpack3及以下版本中，要想使用全局使用process.env.NODE_ENV，需要先在启动项目的命令行中配置：

并在webpack.config.js中配置：

这样才可以在项目中全局使用process.env.NODE_ENV区分开发环境或生产环境。

另外，官方文档上注明一句话：

我试了一下，在webpack5.2的版本中，在命令行设置

然后在webpack.config.js中,特意把mode和NODE_ENV写成不一样

然后执行npm run build
发现在页面中打印process.env.NODE_ENV的值为production。
但是页面打包的时候，仍旧相当于启用了development模式 。
这样就印证了文档的那句话：
设置NODE_ENV的值，不会改变mode的值。

参考：
webpack之mode
理解webpack之process.env.NODE_ENV详解