在 React 應用程序的 shell 腳本中設置環境變量

Question

我正在嘗試在 powershell（和 bash）腳本中設置一些環境變量，並在 ReactJS 應用程序中讀取它們。 shell 腳本很簡單：

$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正確獲取，但沒有任何變量（包括PORT ）通過 React javascript 中的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 正確設置了端口，但沒有任何信息使其進入反應應用程序：

#!/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 無關。

Answer 1

根據 create-react-app的文檔，您希望使用的每個環境變量都必須以REACT_APP_為前綴：

注意：您必須創建以 REACT_APP_ 開頭的自定義環境變量。 除了 NODE_ENV 之外的任何其他變量都將被忽略，以避免意外暴露機器上可能具有相同名稱的私鑰。 如果開發服務器正在運行，更改任何環境變量都將要求您重新啟動它。