Lovable App Shows Blank Screen After Deploy
Quick Answer
Missing environment variables in Vercel. The app works in Lovable's preview because Lovable injects the variables automatically. Vercel doesn't know about them. Start with "Read the real error" before making broader code changes.
You're in the right place if...
- !Works in Lovable preview
- !Shows blank white screen on Vercel URL
- !No error message — just white
Why this happens
Missing environment variables in Vercel. The app works in Lovable's preview because Lovable injects the variables automatically. Vercel doesn't know about them.
Fix
Read the real error
Open your deployed site, press F12 to open DevTools, click the Console tab. The actual error is hiding here. Read it before doing anything else.
Add environment variables to Vercel
Go to Vercel Dashboard → Your Project → Settings → Environment Variables. Add every variable from your .env.local file. Every single one.
NEXT_PUBLIC_SUPABASE_URL=https://xxx.supabase.co NEXT_PUBLIC_SUPABASE_ANON_KEY=eyJ... STRIPE_SECRET_KEY=sk_test_...
Redeploy
Environment variables don't apply to existing deployments. Go to Vercel Dashboard → Deployments → three dots on latest → Redeploy.
Prevent this next time
Before deploying, make a checklist of every environment variable in your .env.local file. Add them all to Vercel before the first deploy.
Frequently Asked Questions
Lovable preview auto-injects environment variables. Vercel requires you to add them manually.
In Lovable, check the Supabase integration panel. Your Supabase URL and anon key are there. Stripe keys are in the Stripe dashboard.
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 →