Running into Error: @clerk/nextjs: Missing publishableKey. when following the The Modern React Tutor
Anyone else run into this error when deploying to Vercel?
- Clerk is working fine on localhost
- NEXT_PUBLIC_CLERK_PUBLISHABLE_KEY added to vercel Environment Variables
First time using Clerk so I'm not sure if it's my code or something mis-configured in the Clerk admin
https://github.com/ruridge/t3gallery
GitHub
GitHub - ruridge/t3gallery
Contribute to ruridge/t3gallery development by creating an account on GitHub.
Solution:Jump to solution
Looks like it's a Vercel incident:
[Vercel status] Investigating: New environment variable not appearing in production deployments https://stspg.io/2jnk8gcxtllr...
10 Replies
you might need to pass it yourself to the ClerkProvider component:
this is assuming it's inside a client component
I'm using a server component, same as Theo did in the tutorial
Looking into this there is a lot of confusion around the need or not of defining the publishableKey prop

oops, I meant to write server component. this would only work for a server component, not a client component
I'll try it out, I'll 🤦♂️ if it's this because I found this prop but noticed Theo wasn't using it lol
nah, same issue.
is the key set to be available in production e.g.

yep 👍

I'm out of ideas then. you might want to ask this in Clerk's own Discord server if you haven't already
Thanks for trying, appreciate it 🙏
Solution
Looks like it's a Vercel incident:
[Vercel status] Investigating: New environment variable not appearing in production deployments https://stspg.io/2jnk8gcxtllr