Environment Variables Not Working on Vercel
Quick Answer
Env vars added after deployment don't apply to existing deployments. Also, browser-accessible vars need the NEXT_PUBLIC_ prefix. Start with "Add vars and REDEPLOY" before making broader code changes.
You're in the right place if...
- !App works locally but breaks on Vercel
- !Variables are undefined in production
- !API calls fail on deployed site
Why this happens
Env vars added after deployment don't apply to existing deployments. Also, browser-accessible vars need the NEXT_PUBLIC_ prefix.
Fix
Add vars and REDEPLOY
After adding env vars, you MUST redeploy. Deployments → three dots → Redeploy.
Check NEXT_PUBLIC_ prefix
Variables used in browser code need NEXT_PUBLIC_ prefix. Server-only variables must NOT have it.
# Browser-accessible (MUST have prefix): NEXT_PUBLIC_SUPABASE_URL=... NEXT_PUBLIC_STRIPE_PUBLISHABLE_KEY=pk_... # Server-only (NO prefix — keeps it secret): STRIPE_SECRET_KEY=sk_... SUPABASE_SERVICE_ROLE_KEY=...
Prevent this next time
Add all environment variables to Vercel BEFORE your first deployment. Saves a redeploy.
Frequently Asked Questions
Vercel injects env vars at build time. Existing deployments were built without your new variables.
Only for values safe to expose publicly (Supabase URL, Stripe publishable key). Never for secrets.
Related fixes
Weekly Newsletter
Get next week's fix before you need it.
Join developers getting weekly vibe coding tips, error fixes, and tool updates.
Subscribe on Substack →