I have a single page app (Vue JS) that is built and released as docker image. The docker image is based on the official Nginx Docker image and serves the SPA as static content.
Until now, there was only a single non-development deployment of that SPA, so the URL of the back-end API was hard-coded in the production build parameters of the SPA. Now we are introducing multiple staging environments that each need their own SPA & API deployment. E.g.
This means that hard-coding the API URL does not work anymore. Creating multiple SPA docker images is also not an option, since there are many staging environments and not all of them are known up-front. This means that the API URL in the SPA Docker image needs to be configurable, preferably with environment variables that are passed into the Docker container.
What are best practices for making SPAs configurable, when there is no dynamic server-side rendering in place?