Lovable to Vercel, and what stays behind.

Vercel can run your app's screens. The database, logins and Lovable bill stay where they are.

You can put a Lovable app on Vercel: sync it to GitHub and import it. But Lovable to Vercel moves the front end only, the screens people see. The database, logins, stored files, functions, secrets and the Lovable bill stay on Lovable until you move each one. Vercel's free plan is for non-commercial personal use, so an app that takes payment needs a paid plan.

Last checked: 22 October 2026.

Can you deploy a Lovable app to Vercel?

Yes. Sync the project to GitHub, then import that repository in Vercel.

GitHub is a website where developers keep code. Lovable can copy your project there and keep it in step; the set-up is in Export your code. Vercel then reads the repository and deploys the app (Vercel, checked 22 October 2026).

Since 9 July 2026, Vercel detects newer Lovable apps without build settings (Vercel changelog, checked 22 October 2026). That works if the project's Lovable config package, @lovable.dev/vite-tanstack-config, is version 2.6.2 or higher. Projects on an earlier version of that package update it first. After that, each change in Lovable syncs to GitHub and starts a new Vercel deployment.

Why move? Lovable names your own deployment pipeline, a compliance or residency rule, or a hosting policy. It says most teams keep Lovable's hosting, and each part you move becomes yours to run and secure (Lovable, checked 22 October 2026).

Which kind of Lovable app do you have?

Apps created from 13 May 2026 run server code. Older apps are static files. The kind decides which steps apply.

• Newer apps (created from 13 May 2026). Built with TanStack Start. The host has to run a server, and the project needs nitro in its package.json.
• Older apps. Built with React and Vite. They build to static files in a folder called dist, and every page address must fall back to index.html.

To check, open the Code tab in Lovable and open package.json, the file that lists what your app is made of. A newer app lists @tanstack/react-start. Or ask Lovable in the project chat which stack your project uses (Lovable, checked 22 October 2026).

How do you move a Lovable app to Vercel?

Eight steps, in this order. The sign-in addresses go in before you test.

1. Connect Lovable to GitHub. Git sync works on all plans. See Export your code.
2. Import the repository in Vercel at vercel.com/new, on the production branch Lovable syncs. Check the build values before you deploy: build command npm run build, Node.js 22, and dist as the output folder for an older app (a newer app needs none). Lovable says most hosts detect these; check rather than assume. Older apps only: add the vercel.json rewrite from Vercel's Vite page before you deploy (see the 404 section below).
3. Add the environment variables, then redeploy. These are settings your app reads when it starts; the names are in the .env file in your repository. Browser: VITE_SUPABASE_URL and VITE_SUPABASE_PUBLISHABLE_KEY (older apps also VITE_SUPABASE_PROJECT_ID). Newer apps also need SUPABASE_URL and SUPABASE_PUBLISHABLE_KEY. Secrets your server functions read are not in the repository, so you add them in Vercel yourself. Lovable does not export secret values. Inferred: you may need to take them from the service that issued them. Vercel applies a changed variable only to new deployments, so redeploy (our reading of Vercel's page).
4. Add the new vercel.app address to your sign-in redirect URLs, before you test. These are the addresses your sign-in may send people back to. In Lovable: More → Users → Settings → Advanced → Redirect URLs, or ask in the project chat (Lovable, checked 22 October 2026). On your own Supabase project, add it there under Auth → URL Configuration. Inferred: Lovable adds a custom domain automatically only when you connect it in Lovable, so a domain connected only to Vercel is not added for you.
5. Test on the vercel.app address. Refresh a page inside the app, sign in and out, then read, write and upload something. A sign-in redirect error usually means step 4 is missing. Lovable does not say whether its managed Google sign-in works on a domain served by another host, so test it here before you switch.
6. Add your domain in Vercel: Settings → Domains → Add Domain, then change the DNS records at your registrar. If you switch to Vercel's nameservers, copy your existing DNS records first, including email records (Vercel, checked 22 October 2026). Add the domain to the redirect URLs too. Inferred: if the domain is connected to Lovable, remove or change it there.
7. Decide what happens to your lovable.app address. It stays with Lovable and keeps showing the last version you published there until you unpublish it.
8. Keep editing in Lovable. Each push deploys to Vercel. The Publish button still publishes to Lovable hosting only.

Lovable lists other hosts that work from GitHub the same way, such as Netlify and Cloudflare Pages; their build and 404 settings differ, so follow Lovable's page for them.

Lovable's own prompt. Lovable has a documented prompt that asks it to prepare the project for another host and list the variables and sign-in addresses you need: Ask Lovable to prepare the deployment (checked 22 October 2026). Lovable says it cannot run or test the result outside its own preview, so you still test on the Vercel address (step 5). Never paste a key, token, password or secret value into a chat, a repository or a form.

Why does my Lovable app show 404 on Vercel?

On older apps, refreshing any page except the home page shows a 404 until you add a vercel.json file. On newer apps, Lovable says a 404 usually means the server part is not running.

Vercel's Vite page explains it: a single-page app does not handle deep links out of the box. The fix is a vercel.json file at the project root, with a rewrite that sends every page address to /index.html. Vercel shows the snippet on its Vite page (checked 22 October 2026).

Icyytouch posted on the Vercel Community that they built a project in Lovable, put it on GitHub and deployed it to Vercel, and every page except the home page gave a 404 on refresh (7 May 2026). The thread shows no accepted fix. It is self-reported and shows the problem exists, not how common it is.

Someone who builds Lovable sites for clients reported a 404 on deploy too (24 Jun 2026). A community member replied with checks (the Vite preset, the dist output, the root folder, a vercel.json rewrite) and suggested asking Lovable in the chat to add the file. That is forum advice, not Vercel's or Lovable's. Both threads are from before Vercel's 9 July 2026 support for Lovable apps.

Does moving to Vercel get you off Lovable?

No, not on its own. Only the front end moves.

Lovable's documents call its backend the "built-in backend". The product also calls it Lovable Cloud. On this page they are the same thing (our reading).

Moves to Vercel

• The front end, the screens people see
• Server functions, on newer apps
• Your domain

Stays on Lovable until you move it

• The database and its records
• User accounts and sign-in
• Stored files
• Edge Functions and their secrets
• AI calls and connectors
• The Lovable subscription

Your lovable.app address stays live too. A code export or a domain change cancels nothing: your new host bills under its own plan, and the Lovable subscription and any Cloud usage continue until you change them (Lovable, checked 22 October 2026).

Leaving Lovable completely is a separate job. In Lovable's order: restore your data and test it; replace the connectors, AI features and built-in backend address that still run through Lovable; plan the final copy; move your domain and unpublish the app; then download and check your exports before removing the database, because that deletes the backend permanently. The data export is in Export your code.

Can you host a Lovable app on Vercel for free?

Vercel's free plan is for non-commercial personal use only. An app that takes payment is commercial under Vercel's own rule.

Vercel's free plan is called Hobby (Vercel, checked 22 October 2026). Its fair use guidelines say: "Hobby teams are restricted to non-commercial personal use only." (Vercel, last updated 14 September 2026, checked 22 October 2026).

Vercel's examples of commercial use include requesting or processing payment from visitors, advertising the sale of a product or service, and being paid to create, update or host the site. Asking for donations is not commercial. All commercial use needs a paid Vercel plan.

Our reading: an app that takes payment, sells a subscription or advertises your product for sale reads as commercial under that wording. So does an app written by a paid freelancer or agency. We can't say whether your own app counts. If you are unsure, ask Vercel's Support team.

On Lovable's side (Lovable, checked 22 October 2026): publishing to a lovable.app address is free on all plans, and the plan does not cap visitors or bandwidth. Your own domain needs a paid Lovable plan. A live site uses no credits by itself, but backend and AI activity use run credits, and the Free plan limits server requests for newer apps.

Can you self-host a Lovable app, backend included?

Yes, but it is a separate project.

Lovable documents moving the backend to managed or self-hosted Supabase, or to other providers with the same parts. Moving only the database does not move logins, storage, realtime or Edge Functions (Lovable, checked 22 October 2026). So the data, files, functions, secrets, sign-in and integrations each move one by one. The data export is in Export your code.

Free

What should you do next?

Before you move anything, a person on our team can check what still depends on Lovable. They record a walkthrough of your app: what stays, what needs fixing and what blocks launch. Then they send you a one-page note. It is free. It does not move your app or promise a move.

Get the Free Build Audit →