Next.js Discord

Discord Forum

NextJs Dropping ENV in strange way ✅

Answered
Cape lion posted this in #help-forum
Open in Discord
Cape lionOP
Hi guys, im using t3 and next 14.

t3 stack also has a function where it uses Zod and validates the envirenment variables and moves them to a const called env.

I can get it like this:
import { env } from "./src/env/server.mjs";

It works.

Now in my next.config.mjs i print out a few key properties from the aforementioned env, that works too.

I've been working on this app for quite some time - it's in production and running well, making small change...

Today i was working on some totally unrelated client side code, and restarted my dev box and the app runs and the prints out the enviment variables as usual from the next.config.mjs, but then it throws a big zod error that all the of the envirnment variables are missing.

I stashed any changes, but there's nothing related to that.

I pulled the most recent commit from my dev branch to a new directory and pulled the env and reinstalled the deps and the app worked...

And then an hour later, the same error popped up again!


Anyone seen anything like this before?
Answered by Cape lion
idea: ill hop around my commit history and try to find if ithis started with a particular commit
View full answer

39 Replies

Cape lionOP
@joulev it does
Cape lionOP
This initially fires and everything is valid
and then it fires again somehow and it's invalid
can you try accessing it via process.env.ENV_FILENAME
Cape lionOP
the thing is, the first console log hits, and then the second one hits a little later
Can you read env directly with process.env?
Cape lionOP
yes
its resoloved by reinstalling the project
yay
Cape lionOP
No ! it broke again
this time for some paths but not others
@ᴉuɐpɹɐɐ
@Cape lion <@194128415954173952>
Does process.env.DATABASE_URL returns something?
Cape lionOP
yes it works on other paths
hmm i have an idea
does process.env.DATABASE_URL works on this path?
Cape lionOP
i think it's throwing the error on the client side, note the server side
maybe it's calling the server.env instead of the client env
@ᴉuɐpɹɐɐ does `process.env.DATABASE_URL` works on this path?
Cape lionOP
lets see if i can test this first
yes it prints in serverside
Cape lionOP
is there a way to map these files back to the original tsx ?
cc @ᴉuɐpɹɐɐ thanks for your help
Cape lionOP
no
i cannot find the reference to a server env in the client side
im not sure if that's the actual problem but it seems like a good place to look
thanks @joulev
Cape lionOP
idea: ill hop around my commit history and try to find if ithis started with a particular commit
Answer
Cape lionOP
that worked
duh
i think this is a dumb thing to do but easy to make this mistake
i had a simple utility function
export function getLabelForUrl(url: string) {
  const label = url.replace(/^(https?:\/\/|ftp:\/\/)/, "").substring(0, 255);
  return label.replace(/[\/?#]\s*$/, "");
}


that was sitting in a file that imported the server env, and then that got called from the client side (in adition to the server side.

I dont know why the error only showed up a day or two after i started calling that function but it is resolved now - i've moved it to an agnostic utils file
Original message was deleted
you can mark the answer