Issue with environment variables in a NextJS and Sanity app, seeking help and suggestions.

Hello 🙂I have reasons to believe that my Sanity & NextJS app have a problem using environment variables
😕

they yield an

undefined

value

according to the following, it might have something to do with

dotenv

which is featured on Sanity https://github.com/vercel/next.js/discussions/12754#discussioncomment-13033

my question is: is it ok to remove the package from Studio?

hmm actually, I don’t think that will be possible, am I right?

any other ideas as to how to fix this issue please?

this is the code I’m working on https://github.com/eugelogic/gothenburg

Hi Eugene - perhaps you've already been down this road, but I banged my head on the .env for a while until I found in the docs that for the studio you need to prefix them with

SANITY_STUDIO

. Is that any help? https://www.sanity.io/docs/studio-environment-variables#f5e9e3158896

Hi Joseph, thanks for getting back to me.I did not know about that, good to know.
Unfortunately my issue lives in the NextJS part of my project and I need to prefix the variables with

NEXT_PUBLIC_

This is really puzzling, I’ve spent hours and read lots but whatever I find is related to either NextJS or Sanity, no the two together, I can’t believe I’m the only one facing such issue
🤔

or maybe I’m missing something obvious, it might worth mentioning I use Lerna and Yarn Workspaces 🙄

Hi - I don't have particular experience with Next and I don't do any monorepo stuff regularly (having 2+ repos has worked for me, but I do most projects solo). But maybe it's something to do with how your build process is configured with Lerna? Have you tried making a copy of your Next repo and running a build on it locally to see if that build will incorporate your environment variables correctly? That way you could rule out any weird syntax mistake you might be missing on the Next side of things?

Could you share the bit of code where you use the env variables that turned out to be undefined & also where you put them? .env.local?

hi I did try to run

build

but it would flag that the env variable is

undefined

also tried to hardcode the actual value of the env variable and it did work so it’s something to do with

process.env

I guess

hi the code lives at https://github.com/eugelogic/gothenburg/blob/main/web/lib/config.js and my env variables live in a

.env.local

file in the root of the repo which of course you can’t see online because I’m not committing it GitHub

Just to be clear, the .env.local is in the

web

directory and not the root directory, is that correct? Because I think Next wouldn’t see it otherwise

no it’s in the root of the project, not inside the

web

folderI did read somewhere Next would be able to see it regardless
+ I did move it inside to see if that was the issue, re-started the server but it didn’t help, lemme try again

lol - it works 😅I have no idea why it didn’t when I tried the other day but it does now
thanks for making trying again
👍

Nice! Glad you got it figured out!

much appreciated 🙏