Discussion on "Building a Github Repo Template Part 5: Next.js Environment Variables"

Blaine Garrett · 2020-07-17T20:06:43.413Z

In this ongoing series, I am putting together a Github Repository Template for my "Go To" front-end tech stack of Next.js, React, TypeScript etc. In this installment of the series, I will get custom environment variables into our Next.js application ...

Hi Blaine Garrett,
Thanks for sharing a great writeup about a gnarly topic.

I have a minor correction to share. You wrote:

"Note: This hierarchy optionally goes further with .env.development and .env.production (corresponding to the value of NODE_ENV)..."

But they don't actually correspond to the value of NODE_ENV. Next.JS bases its decision to read from .env.development vs .env.production on one thing only: whether you start the app with next dev or next start. That's all. NODE_ENV's value is irrelevant to that bit of Next-specific logic.

AFAICT you get the rest of the complicated picture right; hopefully my comment will inspire you to edit the post, or at least help ensure other readers aren't accidentally misled.

Slainte, Chris

Thanks Chris! I made the correction.

However, now that I reread the loading order docs, I'm conflicted if this is accurate. nextjs.org/docs/basic-features/environment-variab…

Again, I don't use this feature often so I hesitate to dig further at the moment. I tend to explicitly add the NODE_ENV to my command line args when running the prod build locally but it might be redundant in that next dev is implicitly NODE_ENV='development' and next start is NODE_ENV='production'. I'm tempted to see what NODE_ENV='development' next start produces. I'll have to try it out later. Anywho, thanks again for commenting and I'm glad these articles are still helping folks out after 2 years.

Right on, Blaine Garrett.

FTR I did exhaustive tests including NODE_ENV=development next start, NODE_ENV=production next dev, etc -- but I'm also currently stuck on v10.2.3. Maybe this has since changed in v11 or v12.

IMHO Next.js made a rare misstep in being both opinionated and rigid about proper support for true 12-factor config that lives in the runtime deploy environment. It probably stems from their original desire to stay "close" to create-react-app, and ofc whatever most closely aligns with Vercel's preferred hosting model. (shrug)

Slainte,
Chris

Search Hashnode

Building a Github Repo Template Part 5: Next.js Environment Variables

Responses1