将自定义环境变量传递到码头化的react管理应用程序中

Question

我在一个项目中使用react admin，该项目将在Docker群中运行。

由于我们有多个环境，我定义了一个环境变量REACT_APP_API_ENDPOINT，它指向我们的应用程序的API，react-admin将与之交互。

到目前为止，我已经了解到这个变量必须在构建时"烘焙到react admin中"。所以我在Dockerfile中添加了以下内容：

ARG REACT_APP_API_ENDPOINT
ENV REACT_APP_API_ENDPOINT $REACT_APP_API_ENDPOINT

如果这是真的，我的以下假设是否正确？

• 当运行docker build命令时，我必须设置REACT_APP_API_ENDPOINT的值
• 每个环境我需要一个Docker镜像

或者有更可行、更动态的方法将该变量传递给react admin吗？

Answer 1

1

dockerfile

ARG REACT_APP_API_ENDPOINT

docker build --build-arg REACT_APP_API_ENDPOINT=192.168.0.1

2. 您将需要为每个环境构建容器

Answer 2

我终于让它工作起来了。

Dockerfile

ARG REACT_APP_API_ENDPOINT
ENV REACT_APP_API_ENDPOINT $REACT_APP_API_ENDPOINT

然后，构建容器：
docker build -t myimage --build-arg REACT_APP_API_ENDPOINT=<URL> .

这对我来说有点奇怪，但我想不出其他方法，因为React在构建时确实需要REACT_APP_MY_VARIABLE之类的自定义变量。

Answer 3

一开始，我认为在docker compose文件中传递环境变量是可行的，但在Dockerfile(打印系统环境变量)中使用RUN printenv，我发现我传递的变量在React构建生产文件时不可用。这里的关键是在创建映像时，在创建React构建文件之前，在Dockerfile中传递环境变量。因此，像这样的Dockerfile应该可以工作：

FROM节点：13.12.0-阿尔卑斯山建造WORKDIR/appENV PATH/app/node_modules/.bin:$PATH#声明react自定义环境变量环境反应_APP_API_HOSThttp://localhost:8080复制软件包.json/复制package-lock.json/RUN npm ci--静默复制/RUN npm RUN build