-
-
Couldn't load subscription status.
- Fork 27.1k
Description
Is your proposal related to a problem?
I faced the issue that there is no standard way to override env vars which a react app uses on the Docker container startup a step.
Example:
- My app uses
REACT_APP_API_URIenv var which stores the path to back-end API. - On CI pipeline I have a
buildstep which builds my js code to a compressed production version. - After that in another CI step (let's say
docker-build) I use compressed code from the previous step to build a lightweight Nginx-based docker container. - Now I have two environments
StagingandProduction. Of course, each environment has its own backend with a different API URI. So, I want to run two instances of the same container but with different REACT_APP_API_URI env var:
// On Staging env:
docker run -p 8080:8080 -e REACT_APP_API_URI =http://staging.api.example.com my-container:latest
// On Production env:
docker run -p 8080:8080 -e REACT_APP_API_URI =http://api.example.com my-container:latest
But it is will be impossible to do because JS code are already built.
It's the only way to do a similar (but not the same) thing is to set REACT_APP_API_URI var on build CI step. But, in this case, the value will be compiled into docker container and I will not be able to override it by passing -e option to docker run command.
To somehow deal with it I have to build two actually the same containers but with different REACT_APP_API_URI values but it is not convenient and violates actually 12 factors app principles.
I solved this problem by the way described in this article: https://www.freecodecamp.org/news/how-to-implement-runtime-environment-variables-with-create-react-app-docker-and-nginx-7f9d42a91d70/.
The solution from the article gave me only one container and the possibility to override env variables by using -e option.
Describe the solution you'd like
Why you can't just add some similar functionality in form of a build option, plugin, or probably official tool which gives us a standard way to override env vars from outside?
Additional context
I'm not a frontend developer, so sorry if I'm missing something