MELLEPRISE MELLEPRISE MP Blog
← All articles

Lovable not working after publish — white screen from preview

Pastel comic of a website window showing a plain blank sheet after a big publish button press

Lovable not working after publish usually means preview was green and the live URL shows a white screen, endless spinner, or a shell with no data.

You built in the editor. Routes worked. Buttons responded. You hit publish and copied the link. Friends open it and see nothing. You see nothing in a private window. The same project still runs in preview. Production and preview are not the same runtime, and the gap shows up as silence instead of a friendly error banner.

What you see when lovable not working hits production

Symptoms cluster into a few patterns. Match yours before you chase the wrong fix.

  • White or blank page. HTML loads. The root div is empty. Console shows a JavaScript error or a failed chunk.
  • Spinner forever. Auth or data fetch hangs because env vars are undefined on the live host.
  • Login works in preview, dead live. Sign-in loops or does nothing after publish. Often auth URLs still point at localhost.
  • API routes 500. Server handlers throw because process.env keys never reached production.
  • Partial UI. Navbar renders. Main content is empty because Supabase returns permission errors the preview never hit.
  • Custom domain loads HTTP only. Browser blocks mixed content or scripts when SSL is not ready.

Each feels like “the app broke.” Most traces back to settings the editor never asked you to confirm. The lovable deploy hub lists the five production areas that fail together.

Why preview works while lovable not working shows live

Lovable optimizes the build loop inside the editor. Preview runs on infrastructure the platform controls. Integration keys for Supabase, Stripe, and OAuth often exist only in that preview context. The AI wires signInWithOAuth, fetch calls, and client keys against hosts that already work there.

Publish copies your frontend to a live URL — often *.lovable.app or a connected Vercel project. That host does not inherit every secret from the chat panel. Redirect URLs in Supabase still list localhost. Stripe webhooks still point at a tunnel you closed. RLS may be off in preview because you tested with a service role or demo session.

Build failures also differ. Preview may serve a dev bundle that tolerates missing optional imports. Production minification exposes dead code paths. A wrong import path crashes the whole React tree. Users see white. The deploy log shows the real line number.

None of this means Lovable “lost” your code. It means last-mile production config was never aligned with the hostname users actually open.

Forum threads about lovable not working rarely mention a single broken component. They mention publish day: env empty, auth localhost, chunk 404. Treat those as one checklist, not seven separate mysteries.

Fix lovable not working step by step

Work in this order. Skipping ahead wastes another publish cycle.

  1. Open the live URL in a private window. Bypass cached sessions and old service workers. Note the exact URL including https://.
  2. Open browser DevTools → Console. Copy the first red error. Common hits: undefined is not an object for Supabase URL, Failed to fetch on API routes, ChunkLoadError after a deploy mismatch.
  3. Check the hosting deploy log. In Lovable or connected Vercel, open the latest production deployment. Build must be green. Read warnings about missing env vars.
  4. Copy every env var to production. Match names exactly: VITE_SUPABASE_URL, VITE_SUPABASE_ANON_KEY, Stripe keys, webhook secrets. Redeploy after saving.
  5. Update Supabase Site URL and Redirect URLs. Set Site URL to your live origin. Add preview, live, and localhost to Redirect URLs. See the lovable login walkthrough.
  6. Confirm JS chunks load. Network tab: no 404 on assets/*.js. Wrong base path or stale cache causes blank screens after redeploy.
  7. Test auth and one data write. Sign in fresh. Insert a row. If preview worked and live fails, compare Supabase project IDs — two different projects is a frequent silent killer.
  8. Republish from Lovable. After dashboard and env fixes, publish again so the bundle matches current code.

If console shows Stripe or webhook errors, register the live endpoint before another test charge. If console shows RLS violations, enable policies before blaming the UI.

Checklist before you call lovable not working fixed

  • Live URL loads without white screen in a private window
  • Console has no uncaught errors on first paint
  • Every process.env / import.meta.env name exists in production hosting
  • Supabase Site URL matches live origin
  • Redirect URLs include live and preview
  • Auth completes without looping back to login
  • At least one real insert or read works under anon key + RLS
  • Custom domain shows valid HTTPS if you use one

When several items were wrong, fix URLs and env together. Partial fixes leave lovable not working on a different button.

FAQ

Why is lovable not working after publish when preview worked?

Preview runs on Lovable’s host with keys and URLs the editor already injected. Production uses a different origin, build output, and env vars you must set manually. Missing secrets or wrong auth URLs often surface as a blank page instead of a clear error.

How do I debug a white screen after lovable publish?

Open the live URL in a private window, check the browser console for red errors, and read the hosting deploy log. Search for undefined env vars, failed imports, and 404 on JS chunks. Fix env in production, republish, and hard-refresh.

Does republishing fix lovable not working on its own?

Republish picks up code changes but not missing Supabase Site URL, Stripe webhooks, or Vercel production env vars. You must align those settings with your live domain first, then publish again.