如何在 React 中重用或扩展 .env 变量

Question

每次我需要在多个地方键入相同的值时，我都有 reactJS APP(CRA) 并为 properties.But 添加了 .env 文件。那么有没有什么办法可以复用呢

我的.env:

REACT_APP_SERVER_API=https://api.mysite.com
REACT_APP_AUTH_API=https://api.mysite.com/auth/login
...

但想要

REACT_APP_AUTH_API=${REACT_APP_SERVER_API}/auth/login

我尝试了不同的方式，例如：

REACT_APP_AUTH_API=${REACT_APP_SERVER_API}
REACT_APP_AUTH_API={REACT_APP_SERVER_API}
REACT_APP_AUTH_API=REACT_APP_SERVER_API
REACT_APP_AUTH_API=`${REACT_APP_SERVER_API}`
REACT_APP_AUTH_API=`{REACT_APP_SERVER_API}`

none 以上内容已被评估，所以我不得不多次输入相同的内容，我有大量 api 具有父子 uri 的列表。

Answer 1

这在 create-react-app 文档中有记录here。

扩展当前 .env 文件的本地变量：

DOMAIN=www.example.com
REACT_APP_FOO=$DOMAIN/foo
REACT_APP_BAR=$DOMAIN/bar

或者，您可以在 javascript 文件中处理。

const API_BASE_URL = process.env.REACT_APP_SERVER_API;

const LOGIN_URL = `${API_BASE_URL}/auth/login`;
const GET_DATA = `${API_BASE_URL}/data`;