I find it difficult to achieve the devops holy grail of "build once deploy everywhere" on my team, as everyone just loooves NEXT_PUBLIC_* env vars, which get baked into the transpiled code.

I'd like to see what everyone's doing for the "build once, deploy everywhere" approach. How do you get the various values into the environment?

Please be gentle and detailed, if possible, as I am not a Next.js developer, although I am familiar with the ecosystem.

I'm building a Docker image, and deploying to AWS ECS, if that matters.

The approaches I thought about and tried before:

- Global hook that loads config from a well-known URL (e.g. /config.json)
- Server-side props (probably the correct approach in my mind, but devs just throw these values everywhere, and it'll be hard to convince them that they need to drill down these values from the page into a hook into another hook into the context to instantiate some API client)
- Mangling HTML entry on load to inject an object (e.g. window.__CONFIG__.FOO="bar". I have not tried it, but I think I could work. Altho, don't think Next.js even has an HTML shell.