The Frontend Environment Variable Problem No One Really Solved

If you've shipped a React, Vue, or Angular app inside a Docker container, you've lived through this: VITE_API_URL=https://api.staging.example.com npm run build That npm run build bakes the URL into the JavaScript bundle. Literally — the bundler finds every import.meta.env.VITE_API_URL reference and replaces it with the string "https://api.staging.example.com" . Static string replacement. The resulting JS file has no concept of an environment variable. It's just a hardcoded string now. Which means your Docker image is environment-specific. You can't promote it to production. You need a separate build with the production URL. The image you tested in staging is a different binary than what goes to prod. This violates the entire point of containers. The Hack Everyone Writes Eventually, someone on the team writes a shell script. It looks roughly like this: #!/bin/sh # env.sh — runs at container startup cat << EOF > /usr/share/nginx/html/config.js window.__ENV__ = { API_URL: " ${ API_URL } "