NextJS app does not recognize env variables on AWS App Runner

Question

Good day everyone. My issue is the following. We use a NextJS app with SSR as the Frontend for our services. We want to deploy everything on AWS App Runner via docker images. Locally the frontend container registers all env variables we have in .env.local but on App Runner all env variables turn out undefined

Of course, we don't want to use an .env file for production. We set up all env variables in the config service of App Runner and we use the NEXT_PUBLIC prefix as we should with SSR. But still nothing.

Does anyone have any suggestions on how to proceed from here?

Answer 1

One solution is to define public environment variables at build time using Docker --build-args:

docker build --build-arg="CLIENT_VAR_FOO=foo" --build-arg="CLIENT_VAR_BAR=bar" ...

Dockerfile:

ARG CLIENT_VAR_FOO
ARG CLIENT_VAR_BAR
ENV NEXT_PUBLIC_CLIENT_VAR_FOO=${CLIENT_VAR_FOO}
ENV NEXT_PUBLIC_CLIENT_VAR_BAR=${CLIENT_VAR_BAR}

You can define them in CI/CD using something like GitHub Actions secrets + environment variables.