Lovable app is a blank white or black screen after publish

What it means in plain English

The browser got a page, then the app stopped before it drew anything. createClient in supabase-js throws supabaseUrl is required. when the URL you pass is empty. A Vite app only copies env vars whose names start with VITE_ into the browser, and it copies them when the site is built, not when someone opens the page.

Lovable's own hosting publishes a snapshot. Edits you make after that stay off the live URL until you publish again. If you moved the app to Vercel, Netlify, or another host, that host has to have the same Supabase names before its build.

Likely causes

• The build that is live ran without VITE_SUPABASE_URL. Lovable's external-hosting guide lists that name, and VITE_SUPABASE_PUBLISHABLE_KEY, for the browser.
• The host has SUPABASE_URL but the browser code reads import.meta.env.VITE_SUPABASE_URL. Those are different names. Lovable says the unprefixed pair is for server code.
• The variable was saved after the build. Lovable says browser values are embedded at build time, so you rebuild to change them.
• You are looking at an older lovable.app snapshot. Lovable says only the current version is deployed, and Publish changes is what updates it.
• Publish never finished. The Publish dialog shows Publishing failed, with Try again or Try to fix, instead of Your website is live.

How to fix it, step by step

1. Open the live URL and the browser console. If the first error is supabaseUrl is required., follow supabaseUrl is required.
2. In the Lovable project, open .env and copy the names exactly. For a Cloud project, Lovable's guide uses VITE_SUPABASE_URL and VITE_SUPABASE_PUBLISHABLE_KEY in the browser, and SUPABASE_URL and SUPABASE_PUBLISHABLE_KEY on the server.
3. On Vercel or Netlify, add those same names for Production, then redeploy. Do not put a secret key on a VITE_ name. That value is shipped in the JavaScript.
4. On the lovable.app address, open Publish and click Publish changes so the URL serves the latest snapshot.
5. If the dialog says Publishing failed, use the action on that banner. Try again is for a temporary issue. Try to fix is for an error in the app, including a build error. Your website is live is the confirmation that the deploy finished.

How to check it worked

• The live URL draws the app.
• The console does not show supabaseUrl is required.
• The Publish dialog says Your website is live, or the other host's latest deployment succeeded after the env vars were set.

A Vite app that never received VITE_ on its public values stays blank for the same reason. See Vite env var missing the VITE_ prefix.

If the publish itself fails, see Lovable app not deploying. If the live site works but isn't in Google, see Vibe-coded site not indexed.

Sources

• https://docs.lovable.dev/tips-tricks/external-deployment-hosting (opens in a new tab)
• https://docs.lovable.dev/features/publish (opens in a new tab)
• https://supabase.com/docs/reference/javascript/initializing (opens in a new tab)
• https://vite.dev/guide/env-and-mode (opens in a new tab)
• https://github.com/supabase/supabase-js/blob/21e9d4b7/packages/core/supabase-js/src/lib/helpers.ts (opens in a new tab)