在一个React应用的shell脚本中设置环境变量

Question

我正在尝试在Powershell（和Bash）脚本中设置一些环境变量，并在ReactJS应用程序中读取它们。脚本很简单：

Original Answer翻译成"最初的回答"

$env:AUTHDOMAIN="some.domain.com"
$env:AUTHCLIENTID="bunch-o-characters"
$env:AUTHCALLBACK="http://somewhere:3002/callback"
$env:AUTHAUDIENCE="auth-audience"

$env:PORT=3002

# Get-ChildItem Env:

yarn start

端口号被yarn正确获取，但是在React JavaScript中，包括PORT在内的所有变量都无法通过process.env访问。"最初的回答"。

console.log("domain     : " + process.env.AUTHDOMAIN);
...
domain     : undefined App.js:33

我的package.json文件没有进行任何修改：

  "scripts": {
    "start": "react-scripts start",
    "build": "react-scripts build",
    "test": "react-scripts test",
    "eject": "react-scripts eject"
  },

我漏掉了什么？Get-ChildItem显示环境变量已正确设置。

编辑：我尝试了这里列出的解决方案，但它不起作用。它还会阻止终端接收任何输出：

$ ($env:AUTHDOMAIN="some.domain.com") -and (yarn start)

相同的结果。

编辑#2：值得注意的是，在linux/bash中行为完全相同（这是一个很好的试金石，因为我已经在bash中做了大约1000亿次）- yarn正确设置端口，但没有任何信息传递到react应用程序中。

#!/bin/sh

export AUTHDOMAIN="some.domain.com"
export AUTHCLIENTID="bunch-o-text"
export AUTHCALLBACK="http://somewhere:3001/callback"
export AUTHAUDIENCE="auth-audience"

export PORT=3002

yarn start

所以这很可能与PowerShell无关。最初的回答。

- Omortis

---

这只是一个上下文的问题吗？如果你将变量设置在系统上下文而不是当前用户上下文中，会得到不同的结果吗？ - undefined

你是指通过[Environment]::SetEnvironmentVariable()吗？我宁愿不这样做。就记录而言，我用完全相同的方法将环境变量加载到golang api中，并且api可以很好地识别它们。 - undefined

环境变量在我关闭服务器后实际上仍然存在于环境中，这有点让人烦恼。 - undefined

你需要重新加载进程 shell 来加载环境变更，参考例如：https://dev59.com/-XVC5IYBdhLWcg3w1Exq - undefined

@iRon，我不认为这些都适用。这是PowerShell而不是cmd.exe，环境变量肯定被设置了（如Get-ChildItem所示），而且这个相同的设置在使用环境变量的golang应用程序中也能正常工作。我不希望这些变量是系统范围的，只想让它们局限于脚本进程。 - undefined

Answer 1

每个你想要使用的环境变量都必须以REACT_APP_为前缀，这是根据create-react-app文档的规定：

注意：你必须创建以REACT_APP_开头的自定义环境变量。除了NODE_ENV之外的任何其他变量将会被忽略，以避免在机器上意外地暴露私有密钥可能具有相同名称的变量。如果更改任何环境变量，则需要重新启动正在运行的开发服务器。

- Dor Shinar

---

刚刚发现了 - 谢谢！值得注意的是，如上所述，发送给yarn（react-scripts）的环境变量不需要满足这个要求。 - undefined

关于重新启动的那一部分很有用！谢谢 - undefined