Move Lovable to Next.js in one click

Why move a Lovable project to Next.js?

Lovable is a brilliant prototyping tool. You describe an app, it ships a working single-page app. But the moment your idea gets traction, the cracks show: SEO is fragile because everything renders client-side, hosting is locked to Lovable's cloud, and payments are possible but complex to get right (webhooks, plans, billing logic), while multi-tenant orgs or a real admin dashboard means fighting the platform.

Lovable → Next.js is a free Chrome extension that fixes that. One click saves your project as a ZIP on your computer, with AI migration agents included. An agent then ports your app to free Indie Kit Starter, a Next.js SaaS starter with auth, database, and app structure ready to go.

How the extension works

Everything runs inside your browser. The extension uses your existing Lovable session (the same login you already have open) to read the project file list and download each file directly to your machine. Your code never touches an Indie Kit server. We don't store, log, or relay your source.

1. Install the Chrome extension from our install page. Download the ZIP, unzip it, and load it in chrome://extensionsCopy chrome://extensions. Free, no account needed.
2. Open any Lovable project you can already access. Hit the extension icon and click Export to Next.js.
3. Choose what to bring along. Name your project and tick Bring your Lovable Cloud if you want your database tables and storage buckets to come along with the code.
4. Save it locally. Small projects download as a ZIP. Bigger ones save straight into a folder you pick. Either way, your code, Lovable Cloud, uploads, and the bundled .cursor/ and .claude/ migration commands all land on your machine.
5. Open in Cursor or Claude Code and run /migrate-to-nextjs. The agent reads your routes, components, Supabase schema, and styles, then ports everything to Next.js App Router with Indie Kit conventions.

Lovable Cloud comes along too

Tick Bring your Lovable Cloud in the export dialog and the extension goes a step further. It reaches into the Supabase database and storage buckets behind your Lovable project, what Lovable calls Lovable Cloud, and saves everything to your computer alongside the code.

• Database tables land as readable JSON files in supabase/existing-data/: one file per table plus a manifest with row counts and column types.
• Storage buckets, your images, PDFs, and anything else users have uploaded, drop into supabase/existing-storage/, keeping their original folder layout so links in your app still resolve.

Public files come straight from Supabase's public URL; private files use a signed-URL flow behind the scenes. Either way, the bytes live on your machine and never on ours. The migration agent then seeds your new Postgres database from those JSON files, and a separate /migrate-storage-uploads command moves the uploads to Amazon S3, Cloudflare R2, or Bunny Storage when you're ready to go live.

If your project is on the larger side, say thousands of rows or a few hundred uploads, the extension automatically switches from a single ZIP to writing files directly into a folder you pick. That way your browser doesn't have to hold the whole export in memory.

What Indie Kit brings to the migration

Most "export" tools dump files. They leave you stuck wiring up the boring stuff: auth, database, sessions, middleware, layouts. Indie Kit is a complete Next.js SaaS starter kit designed for indie developers and AI-driven workflows. Every export targets one of three variants:

• Starter (Free): Next.js 16, App Router, Better Auth, Postgres + Drizzle. Perfect for MVPs.
• Indie Kit Pro: Everything in Starter plus Stripe, Dodo, Lemon Squeezy, credits, waitlists, blog, docs, and a super admin dashboard. Includes free 1-on-1 mentorship.
• B2B Boilerplate: A Next.js starter built for teams and orgs: workspaces, members, invites, RBAC. Picked automatically if your Lovable app already looks multi-tenant.

SEO benefits of Next.js over Lovable's SPA

Lovable builds client-side rendered single-page apps with Vite. That means search engines and AI crawlers (Google, Bing, ChatGPT, Perplexity) see a blank shell on the first request. You have to bolt SEO on by hand and hope the agent renders correctly.

Migrating to Next.js gives you:

• Server-side rendering and React Server Components by default
• Per-route metadata, Open Graph, Twitter cards, canonical URLs
• Auto-generated sitemaps and structured data (JSON-LD) for rich results
• Fast Core Web Vitals thanks to streaming, image optimization, and edge caching
• A real /llm.txt path and clean HTML for AI Overviews and chatbots

Will the migration keep my design?

Yes. That is the whole point. The bundled ui-parity-verifier agent runs a file-by-file loop after migration. It diffs Lovable's pages and your new Next.js app, checks layout, button placement, gradients, typography, and every asset in public/, then fixes mismatches automatically until the migrated screens match the original.

What we store about you

Nothing about your project. The export runs locally. The ZIP saves to your Downloads folder. Lovable's auth cookie stays between you and Lovable; we never receive it. If you want the details, read the extension privacy policy and terms of service.

Who this is for

• Indie hackers who shipped a Lovable prototype and now need real SEO, real payments, and a real deploy.
• Vibe coders who already use Cursor or Claude Code and want their AI agent to own the migration.
• Small SaaS teams that need to own the repo, run CI/CD, and add features Lovable can't cover.