Skip to content
Migrator
Migrate

How to Connect Your Lovable App to Your New Supabase Project

Last updated: By The Migrator Team

Once your data has moved, you need to connect your Lovable app to Supabase by pointing it at the new project. This is a small change, three environment variables and one config line, but it is the moment your real users switch backends, so it deserves a careful test.

Below you will find where to get each value, what to edit, and a safe testing routine. If you used the migration wizard, the final screen shows these values ready to copy.

Where to find your new project's values

Never put the service_role key in front-end code or an .env file that is bundled into the app.

  • Project URL: Supabase dashboard → Project Settings → API. It looks like https://YOUR_REF.supabase.co.
  • Publishable (anon) key: Project Settings → API Keys. This key is safe to expose in a front-end app because Row Level Security protects your data.
  • Project ref: the 20-character id in the URL, also in Project Settings → General.

Connect your Lovable app to Supabase: edit .env and config.toml

Then open supabase/config.toml and change the first line:

  • project_id = "YOUR_REF"
.env
VITE_SUPABASE_URL="https://YOUR_REF.supabase.co"
VITE_SUPABASE_PUBLISHABLE_KEY="your-publishable-key"
VITE_SUPABASE_PROJECT_ID="YOUR_REF"

Redeploy and clear old sessions

Redeploy your front end so the new variables are baked in. If you host on a platform with its own environment variable settings (Vercel, Netlify), update them there as well, because they override the local file.

Users who were signed in to the old backend hold tokens signed by the old project. They will be asked to sign in again, which is expected. Because their ids and password hashes were copied, their old passwords work.

Test the switch before announcing it

  1. 1Sign in

    Log in with an existing account. If it fails, see the troubleshooting guide section on users who cannot log in.

    Browser showing how to connect your Lovable app to Supabase and sign in with an existing account
    Browser showing how to connect your Lovable app to Supabase and sign in with an existing account

  2. 2Read and write

    Open a page that lists data, then create, edit and delete something to prove RLS policies allow it.

  3. 3Uploads and functions

    Upload a file and trigger an edge function. Check function logs in the Supabase dashboard.

  4. 4Check Auth settings

    Set the Site URL and redirect URLs in Authentication → URL Configuration to your real domain so magic links and OAuth return correctly.

Roll back if something is wrong

Your Lovable Cloud backend is untouched, so rolling back means putting the three old values back and redeploying. Keep a copy of them until you are fully confident. The pillar guide lists a full verification checklist.

Frequently asked questions

Is the publishable key safe in my front-end code?

Yes. It is designed to be public, and Row Level Security controls what it can access. Never expose the service_role key.

Why does my app still use the old project?

Hosting platforms often have their own environment variables that override .env. Update them there and redeploy.

Do I need to change code files?

Normally no. The client reads the URL and key from environment variables.

Why are users logged out?

Their session tokens were issued by the old project. They sign in again and everything else continues as before.

How to Connect Supabase to Lovable: Integration Guide

Link your own Supabase project to a Lovable app: keys, auth, edge functions and secrets.

How to Migrate from Lovable Cloud to Supabase

The complete pillar guide: schema, data, users, files and functions, end to end.

Lovable Edge Functions: How to Deploy Them on Your Own Supabase Project

CLI commands to deploy your functions and re-add every secret.

Need help?