在webpack 4中获取可变模式开发或生产

我正在使用Webpack4，我想在配置中使用env环境变量。我是如何通过模式——开发和——生产得到这个变量的？DefinePlugin不起作用，文档什么也没说

也许你可以这样做：

package.json：

"scripts": {
  "dev": "webpack-dev-server --config webpack.config.js --env.NODE_ENV=development",
  "build": "webpack --config webpack.config.js --env.NODE_ENV=production"
},

module.exports = (env) => {
  return {
    mode: env.NODE_ENV,
    // ...rest of config based on environment
  };
};

webpack.config.js：

"scripts": {
  "dev": "webpack-dev-server --config webpack.config.js --env.NODE_ENV=development",
  "build": "webpack --config webpack.config.js --env.NODE_ENV=production"
},

module.exports = (env) => {
  return {
    mode: env.NODE_ENV,
    // ...rest of config based on environment
  };
};

---

OP询问了关于webpack4的问题。在webpack4中，可以使用

--mode

参数，该参数在webpack配置中自动设置

模式

如何在网页配置中使用
模式
？
将
模式
传递到
webpack cli
的示例方法：

"scripts": {
  "start:dev": "webpack --mode development --watch"
}

在网页包配置中，您可以使用第二个参数argv访问参数：

module.exports = (env, argv) => ({
...
   watch: argv.mode !== 'production',
...
})

更新

如果您使用读取网页包配置的IDE（例如Intellij IDEA），您可能需要为
argv
传递一些默认值：

module.exports = (env, argv = {}) => ({

即使IDE没有通过
argv
（在我的例子中，我需要它来支持IDE中的webpack别名模块解析）

更新2

另一件事是babel配置。也许这是一个鲜为人知的事实，但babel及其预设和插件可以在
节点_ENV
上做出反应（它也是可配置的），例如，您可以配置
开发
选项
@babel/preset react
（）。
为了做到这一点，您仍然需要在运行webpack之前设置
NODE_ENV
（默认情况下，或者如果您修改了
babel.config.js
），等等

为什么?？
--mode
所做的唯一事情是1）该值通过配置中的
argv.mode
可用2）通过
DefinePlugin
为捆绑包设置
NODE\u ENV
，但是
NODE\u ENV
未为网页包配置本身或加载程序设置

最后，如果希望捆绑环境和生成的捆绑包之间保持一致，可以使用以下选项：

cross-env NODE_ENV=production webpack --mode production