DEV Community

Discussion on: Environment Variables in Next.js

Collapse
 
akhilaariyachandra profile image
Akhila Ariyachandra

ZEIT recently changed recently changed how the Environment Variables are handled, so I'll need to update the post to reflect that. From what I've tested so far, the now.json file and secrets are no longer needed. You just need to specify the variables with now env add. Hope it helps.

Collapse
 
erangakapukotuwa profile image
Eranga Lakmal

Thank you for replying. Yes, It's working without now.json and the secrets. But after we deploy it the values are not available(undefined) in the "Preview" environment.

Thread Thread
 
akhilaariyachandra profile image
Akhila Ariyachandra

Could you go to the project page in Vercel (ZEIT) and check if the variables are available for Preview? If not you can manually added from there.

Screenshot

Thread Thread
 
erangakapukotuwa profile image
Eranga Lakmal

Yes. I have set the values. We can create env values for all the environments locally using the now env add <VARIABLE NAME> command and publish to remote. Also we can add values directly on the settings page and pull them to the local using now pull env. I tried both ways. Unfortunately the values are available in local but not available on Preview in both cases. Bad luck

Thread Thread
 
akhilaariyachandra profile image
Akhila Ariyachandra • Edited

A workaround I found for now is to list all the variables you want in the client side code in the env property of the Next.js config.

env: {
    AUTH_SECRET: process.env.AUTH_SECRET,
}

I updated the post with more details.