Question

我的应用使用NODE_ENV来决定哪个api服务器应该请求。

NODE_ENV="production" => https://api.***/
NODE_ENV="staging" => https://api.staging-***/
NODE_ENV="development" => http://localhost:3000/

我想用mode =“production”构建staging bundle，但保留NODE_ENV =“staging”。

我尝试使用下面的配置进行构建，但是bundle.js变为NODE_ENV =“production”。

{
   mode: "production",
   plugins: [
     new webpack.DefinePlugin({
       'process.env': {
         'NODE_ENV': JSON.stringify("staging")
       }
     })
   ]
 }

Answer 1

我认为您希望您的登台版本与生产版本一样进行优化。据我所知，一些库（如 React ）将检查NODE_ENV === "production"是否删除了一些错误处理或提供进一步的优化。因此，如果您将NODE_ENV设置为staging，他们会认为＆＃34;它是一个开发环境。

在这种情况下，我要做的就是使用不同的变量，如：

<强>的package.json

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

<强> webpack.config.js

module.exports = (env) => {
  const mode = env.TARGET_ENV === 'development' ? 'development' : 'production';

  return {
    mode: mode,
    plugins: [
      new webpack.DefinePlugin({
        'process.env': {
          'TARGET_ENV': JSON.stringify(env.TARGET_ENV)
        }
      })
    ]
    // ...rest of config based on environment
  };
};

Answer 2

Webpack-cli已被弃用，env的语法在Webpack-command（https://github.com/webpack-contrib/webpack-command#the---env-flag-is-nuked）中不再起作用。

为了满足您的要求，我将使用一个简单的env变量并以标准节点方式使用它

var API_URL = {
  production: JSON.stringify('https://foo.bar/api'),
  development: JSON.stringify('http://localhost:3000/api'),
  staging: JSON.stringify('http://foo.stage.bar/api')
}

module.exports = function(argv) {
  const TARGET = process.env.TARGET_ENV ? process.env.TARGET_ENV : 'development';
  return {
    mode: argv.mode ? argv.mode : 'development',
....
    new webpack.DefinePlugin({
        'API_URL': API_URL[TARGET]
    }),
....
}

并像这样调用webpack：

TARGET_ENV=staging webpack

通过这种方式，您可以在应用程序中全局找到您的环境变量API_URL。

我会避免通过define插件重新定义NODE_ENV。

我可以在webpack 4中使用NODE_ENV =“staging”和mode =“production”吗？

2 个答案: