是使用模式和webpack.EnvironmentPlugin多余？

Question

试图了解webpack.EnvironmentPlugin为我做了什么。

使用mode和webpack.EnvironmentPlugin多余？

即

module.exports = merge(webpackCommonConfig, {
  mode: 'development',
  ...
  plugins: [
    new webpack.EnvironmentPlugin({ NODE_ENV: 'development' }),
  ],
  ...
});

TLDR：这个例子的简短答案：是的，它是多余的。

答案很长：除了说模式正在改变NODE_ENV的env var之外，还有很多事情要做。虽然在表面上看起来好像new webpack.EnvironmentPlugin({ NODE_ENV: 'development' })只是在运行时才这样做。

Answer 1

仅适用于此特定用例！

TL; DR;

--mode development自动设置：process.env.NODE_ENV值development

--mode production自动设置：process.env.NODE_ENV值production

您不需要添加以下插件：new webpack.EnvironmentPlugin({ NODE_ENV: 'development' }),

这将是唯一的冗余设置，因为当使用NODE_ENV: 'development|production'时，--mode将自动设置！

如果你没有设置--mode它将自动默认为production！

继续阅读以了解为什么--mode实际上并不是多余的以及它实际上在幕后做了什么：

---

如果你将--mode设置为production或development，会发生什么：

模式：发展

将process.env.NODE_ENV设置为值development。 启用： NamedChunksPlugin 和NamedModulesPlugin。

模式：生产

将process.env.NODE_ENV设置为值production。 启用： FlagDependencyUsagePlugin， FlagIncludedChunksPlugin， ModuleConcatenationPlugin， NoEmitOnErrorsPlugin，OccurrenceOrderPlugin， SideEffectsFlagPlugin 和UglifyJsPlugin。

--mode在编译过程中添加了不同的插件，取决于为mode设置的值。

>> Reference

请记住，设置NODE_ENV不会自动设置模式