environmental variable value not being processed

user_15479269 0
Viewed 208

I am still learning about env. I'm not sure why it's not working. I have two files in my root project folder. '.env.local' and '.env'. And, the values for .env aren't being processed. However, .env.local is working fine. I believe I followed the same format.

For the .env file, if I just write them on the page and expose them, then they work just fine.

What am I missing here, this is on a NEXTJS app. In vercel I just added Environmental variable to their built in mechanism.

In my code I wrote this to get the value.

env local file

NEXT_PUBLIC_GOOGLE=xxxxxxxxxx

_app.js

my env file MAILCHIMP_PUBLIC_USERNAME=xxxxx MAILCHIMP_PUBLIC_DOMAIN=xxxx MAILCHIMP_PUBLIC_POST=xxxxxxxxxxxxxxxxxxxx& MAILCHIMP_PUBLIC_ID=xxxxxxxx
next.js mailchimp environment-variables
2 Answers

I think .env.local is overriding the other files. Also remember to add NEXT_PUBLIC_ to the variables. After editing the .env file you should stop and restart the development server. In your case you should do the following

NEXT_PUBLIC_MAILCHIMP_PUBLIC_USERNAME=xxxxx
NEXT_PUBLIC_MAILCHIMP_PUBLIC_DOMAIN=xxxx
NEXT_PUBLIC_MAILCHIMP_PUBLIC_POST=xxxxxxxxxxxxxxxxxxxx
NEXT_PUBLIC_MAILCHIMP_PUBLIC_ID=xxxxxxxx
user_80668500

Did You read exactly the next.js docs about Environment Variables ? ;-)

It happens because as we can read in next.js docs:

In general only one .env.local file is needed. However, sometimes you might want to add some defaults for the development (next dev) or production (next start) environment.

Next.js allows you to set defaults in .env (all environments), .env.development (development environment), and .env.production (production environment).

.env.local always overrides the defaults set.

Here You have much more examples how to use .env properly in next.js. source, source

Good Luck and enjoy your study ;-)!

user_137059790
Related