Javascript 运行多个环境变量的包json脚本

在我的

package.json

中，我运行的脚本如下：

"build-dev": "webpack-dev-server --content-base src --inline --hot -p --define process.env.NODE_ENV='\"dev\"' --progress --colors -p --define process.env.REACT_APP_GAMESHOW_URL='\"http://api.gameshow.com/contestants\"' --progress --colors"

而且有效。

基本上，我只是尝试运行webpack并定义一些环境变量：

webpack-dev-server --content-base src --inline --hot

process.env.NODE_ENV=dev

process.env.REACT_APP_GAMESHOW_URL=http://api.gameshow.com/contestants

但是，我多次使用这些参数：

-p--define--progress--colors

有没有办法压缩代码，使其不重复

比如：

-p --define process.env.NODE_ENV='\"dev\"' && process.env.REACT_APP_GAMESHOW_URL='\"http://api.gameshow.com/contestants\"' --progress --colors"

---

我尝试了很多方法，但都不起作用。重复一个像

--progress

和

--colors

这样的标志没有任何作用，就像你只使用过一次一样。

--define

选项可以多次用于定义多个值，并且完全独立于您使用的任何其他标志/选项

您可以在webpack配置中定义这些选项，而不是使用命令行选项。等效的

DefinePlugin

是：

plugins: [
  new webpack.DefinePlugin({
    'process.env': {
      NODE_ENV: JSON.stringify('dev'),
      REACT_APP_GAMESHOW_URL: JSON.stringify('http://api.gameshow.com/contestants'),
    }
  })
]

由于它只是JavaScript，因此还允许您使用

JSON.stringify（）

，从而避免了繁琐的转义和在引号中使用引号。可以根据您的环境更改这些值

• 使用

  --config path/to/config.js

• 环境变量，例如

  NODE\u ENV=生产网页包开发服务器[选项]

例如，您可能只有一个用于开发的URL和一个用于生产的URL，因此您可以按照以下方式进行操作：

const isProd = process.env.NODE_ENV === 'production';
const env = isProd ? 'production' : 'dev';
const url = isProd ? 'http://api.gameshow.com/contestants' : 'http://localhost:3000/contestants';

module.exports = {
  // Rest of your config

  plugins: [
    new webpack.DefinePlugin({
      'process.env': {
        NODE_ENV: JSON.stringify(env),
        REACT_APP_GAMESHOW_URL: JSON.stringify(url),
      }
    })
  ]
};

请注意，它总是检查

NODE_ENV

是否为

production

，因此如果您根本不定义

NODE_ENV

，则默认为开发值，在开发过程中删除另一个命令行选项。使用此配置，您可以运行以下程序进行开发：

webpack-dev-server --content-base src --inline --hot --progress --colors

对于生产，您只需要添加

节点_ENV=production

和

-p

：

NODE_ENV=production webpack-dev-server -p --content-base src --inline --hot --progress --colors

不要在开发中使用

-p

，这是生产标志，在开发中使用肯定没有帮助。有关更多信息，请参阅

如果愿意，还可以配置当前在命令行上指定的其他选项，例如或