通过NPM脚本将变量传递给Webpack

Question

我可以帮您进行翻译。以下是需要翻译的内容：

我有一个使用Webpack构建的生产版本，使用node的process.env来设置环境变量：

webpack.prod.babel.js：

const DefinePlugin = new webpack.DefinePlugin({
  'process.env': {
    NODE_ENV: JSON.stringify('production'),
    API_URL: JSON.stringify('https://myprodurl.com'),
  },
});

packge.json:

"scripts: {
  "build:prod": "webpack"
}

一切运作良好，但我需要不同的东西。

我需要将生产URL设置为NPM脚本中的变量。

因此，不再使用以下内容：

npm run build:prod

我需要这个：

npm run build:prod --URL https://myprodurl.com

- Matheus Lima

Answer 1

你可以在命令行中定义你的环境变量，像这样：URL=https://myprodurl.com npm run build:prod。我用一个简单的脚本测试过，并成功打印出了URL。

"scripts": {
  "test": "./myTest.js"
},

myTest.js:

#!/usr/local/bin/node

'use strict'

console.log(process.env.URL);
console.log('Done!');

那么：

$ URL=https://whatever.com npm run test

> my-test@1.0.0 test /Test/my-test
> ./myTest.js

https://whatever.com
Done!

编辑：如@RyanZim所提到的，有关Windows的信息，请参见以下链接：https://github.com/kentcdodds/cross-env
（免责声明：我不使用Windows并且从未尝试过此库）

- Jeff Kilbride

---

应该编辑以说明，如果需要 Windows 支持，则必须使用 https://github.com/kentcdodds/cross-env。 - RyanZim

你可以在npm run命令前加上环境变量，而不是创建一个全新的脚本文件："build:prod": "NODE_ENV=production webpack" - Dan O

你很接近了，但是你的代码应该是 API_URL: JSON.stringify( process.env.URL ), 才能正确回答这个问题。 - Andy Ray

@DanO 说得好。你可以把它放在 package.json 中的 scripts 条目的命令行中，以简化它。 - Jeff Kilbride

@AndyRay 抱歉，我只是想提供一个简单的可行示例。 - Jeff Kilbride