我面临着一个奇怪的问题，我有这个.env
REACT_APP_URL=http://localhost:8080
REACT_APP_API_URL=http://localhost:4500/api
REACT_APP_VEHICLE_IMAGE_URL='URL'
REACT_APP_NAME=NAME
REACT_APP_GA_TRACKING_ID=字符串
如果我使用npm start运行应用程序，变量将被正确识别。
如果我还尝试在本地运行docker构建，而不从docker hub中拉取镜像，则变量工作正常。这些是命令：
docker build . -t container
docker run -p 8080:8080 --env-file .env -d --name container--restart always container型
它们被识别，应用程序使用这些变量运行。
This is the dockerfile:
FROM node:16-alpine
WORKDIR /app
COPY package.json .
RUN npm install
COPY . .
RUN npm run build
EXPOSE 8080
CMD [ "npm", "run", "preview" ]型
与此同时，每次我推master时，我都会在dockerhub中推应用程序。在这种情况下，变量无法识别：
docker pull user/repository_test
docker run -p 8080:8080 --env-file .env -d --name repo --restart always user/repository_test型
变量没有被识别，这怎么可能呢？我可以在docker的inspect中看到，变量被传递到容器中，但在react中没有被识别。
的数据
在上面的图像中，是来自Docker容器的检查，其中env变量无法识别，但它们存储在容器中。
1条答案
按热度按时间hgb9j2n61#
与您的previous question相比，您现在使用的是React Vite application（与之前的Create React App相反）。您现在更多地关注的是本地Docker构建（其中环境变量被识别）与Docker Hub构建（其中环境变量未被识别）之间的差异。
与I mentioned before一样，React中的环境变量是在构建过程中嵌入的，而不是在运行时嵌入的。这意味着，如果在构建Docker镜像时变量不可用，那么在应用程序运行时它们也不会存在。
从您共享的Dockerfile和工作流来看，GitHub Actions上的构建过程没有使用任何环境变量。因此，当构建应用程序时，环境变量不会嵌入到构建中。
要解决这个问题，您需要确保在CI/CD管道中构建Docker镜像时，环境变量可用。您可以在GitHub Actions工作流中的Docker构建过程中使用build arguments传递环境变量。
字符串
在你的Dockerfile中，你应该在构建步骤之前声明这些参数：
在你的Dockerfile中，你应该在构建步骤之前声明这些参数：
型
您可以在GitHub存储库的secret中设置实际的环境变量。
这样，您的环境变量将在构建过程中包含在内，并且您的React应用程序将在Docker容器内运行时访问它们。