How to Export Your Lovable Project to GitHub

The moment you export your Lovable project to GitHub is the moment your app stops being trapped inside a builder and becomes a codebase you actually own. Lovable does not just hand you a zip; it offers a real two-way GitHub sync, so edits in Lovable land in your repository and pushes to your repository flow back into Lovable. This is the step-by-step guide to doing it properly: connecting GitHub, enabling the sync, cloning the project, running it locally, and wiring up the Supabase environment variables, with the exact commands and the gotchas that quietly break the sync. When we take over Lovable projects for clients, getting the code onto GitHub cleanly is always the first step, because everything else, local development, real version control, and deploying off Lovable, depends on it.

Quick Answer: Exporting Lovable to GitHub

How it works: Lovable has a native GitHub integration. You connect your GitHub account, install the Lovable GitHub App, and connect your project, and Lovable creates a repository with two-way sync on the default branch.

What you can do next: clone the repo, run it locally with Vite, edit in your own IDE, and deploy anywhere, while changes stay in sync with Lovable.

The main rule: the sync only works on the default branch (main), and you must never rename, move, or delete the connected repository, because that breaks the sync permanently.

Key Takeaways

• Lovable to GitHub is a built-in, two-way sync, not a one-time manual export.
• Edits in Lovable auto-push to GitHub in real time, and pushes to main sync back into Lovable.
• The sync is default-branch only. Feature-branch work syncs once merged to main.
• It is a standard Vite + React + TypeScript app with a Supabase backend, so it runs anywhere.
• Running locally needs a .env.local with your VITE_ Supabase keys.
• Never rename, move, or delete the connected repo, or the sync breaks for good.
• Once on GitHub, you can deploy off Lovable to Vercel, Render, or AWS.

Quick Facts

Why Export Your Lovable Project to GitHub?

Three reasons make this worth doing early. You get ownership and a backup, so your code lives safely outside Lovable. You unlock a real development workflow, with branches, pull requests, code review, and the ability to edit in VS Code or Cursor. And you get portability, because a project on GitHub can deploy to any host. If you built the app with an AI-first workflow, our piece on vibe coding versus agentic engineering explains why owning the code is the step that turns a prototype into a product, and our roundup of the top vibe-coded websites shows what teams ship before they make that move.

What You Are Actually Exporting

It helps to know what lands in the repo. A Lovable project is a standard React application built with Vite and TypeScript, styled with Tailwind CSS and shadcn/ui components, with a Supabase backend handling the database, authentication, and storage. There is nothing proprietary about the output, which is exactly why it ports so cleanly. Once it is on GitHub it behaves like any other Vite React app.

Step 1: Connect Your GitHub Account

In Lovable, open the GitHub integration using the GitHub icon in the top-right corner of the editor, or go to Settings and then Connectors. Click to connect GitHub and authorize Lovable through GitHub's OAuth screen. This links your GitHub identity to Lovable but does not yet create a repository. The official walkthrough lives in the Lovable GitHub documentation.

Step 2: Install the Lovable GitHub App

Next, install the Lovable GitHub App so it has permission to create and write to repositories. In the connect flow, choose Add organizations, then Install and Authorize for the account or organization where you want the repository to live. Pick the right owner here, because moving the repository later is exactly the kind of action that breaks the sync.

Step 3: Connect the Project and Create the Repo

With the app installed, connect your project to the chosen organization. Lovable creates a new GitHub repository and turns on two-way sync on the default branch. From this point, every change you make in Lovable is pushed to GitHub automatically, and the repository is the source of truth you can clone. That is the Lovable GitHub integration working as intended.

Step 4: Clone and Run It Locally

Now pull the project onto your machine. Copy the repository URL from GitHub, then run the standard clone-and-start sequence:

git clone https://github.com/YOUR_USERNAME/YOUR_REPO.git
cd YOUR_REPO

npm i          # install dependencies
npm run dev    # start the Vite dev server (hot reload + instant preview)

The Vite dev server usually serves at http://localhost:5173. If it starts but the app cannot log in or load data, you are missing the backend environment variables, which is the next step. Make sure your .gitignore already excludes your local env file:

# .gitignore (Lovable includes this, confirm it)
node_modules
dist
.env
.env.local

Step 5: Set Up the Supabase Environment Variables

A Lovable app talks to Supabase, and those credentials are not committed to the repo. Create a .env.local file in the project root and fill it with the values from your Supabase project settings. Because this is a Vite app, client-side variables must be prefixed with VITE_:

# .env.local
VITE_SUPABASE_URL=https://YOUR_PROJECT_ID.supabase.co
VITE_SUPABASE_PUBLISHABLE_KEY=your-anon-publishable-key
VITE_SUPABASE_PROJECT_ID=YOUR_PROJECT_ID

You find these under your Supabase project: the URL and the publishable (anon) key live in the API settings. Only ever expose the publishable or anon key on the client. The Supabase service-role key is a server-side secret and must never go into a VITE_ variable, because anything prefixed with VITE_ is bundled into the browser. Restart npm run dev after creating the file so Vite picks the values up.

Understanding the Two-Way Sync

This is the part worth internalizing, because it changes how you work. Edits made inside Lovable are pushed to GitHub in real time. Commits you push to the default branch on GitHub, from VS Code, Cursor, or any IDE, appear back in Lovable within seconds. The sync runs on the default branch only, which is normally main. The result is genuine flexibility: prototype a screen in Lovable, then drop into your editor for the tricky logic, and both sides stay current. Just remember the hard rule from the docs: do not rename, move, or delete the connected repository, because that severs the link permanently.

Working With Branches and Pull Requests

Since only the default branch syncs, the clean workflow is to do real development on feature branches and merge to main when ready. That keeps Lovable stable while you work, and the merge is what triggers the sync back:

git checkout -b feature/new-dashboard
# make changes, then
git add .
git commit -m "Add dashboard view"
git push -u origin feature/new-dashboard
# open a Pull Request on GitHub, review, and merge into main
# the merge to main syncs the changes back into Lovable

This gives you proper code review and history without fighting the sync, which is how a Lovable project should be run once more than one person touches it.

Deploying Off Lovable

Exporting to GitHub is also what frees you to host the app yourself. Because the repo is a standard Vite React app with a Supabase backend, you can deploy it to Vercel, Render, or AWS by connecting the repository and setting the same environment variables. If you are also moving the backend, you can migrate from Lovable Cloud to your own Supabase project and repoint the env vars. The mechanics are the same as moving any AI-builder app to production, which we cover end to end in our guide on how to migrate an app to AWS, Vercel, or Render.

Common Pitfalls

• Renaming or deleting the repo. The single fastest way to break the sync for good. Treat the connected repo as fixed.
• Expecting non-main branches to sync. Only the default branch does; merge to main to push changes back.
• Missing .env.local. The app builds but cannot reach Supabase. Recreate the VITE_ variables locally.
• Exposing the service-role key. Never put it in a VITE_ variable; it would ship to the browser.
• Committing .env. Confirm it is in .gitignore before any push, and rotate keys that leak.
• Picking the wrong repo owner. Choose the right organization during install, since moving it later breaks the sync.

Why Teams Work With Make An App Like

Make An App Like has shipped 500+ apps for founders in 40+ countries since 2016, reaches a 50,000-reader audience through our publishing platform, and has been featured by TechCrunch as a leading partner for non-technical founders. We regularly take projects out of AI builders like Lovable and onto owned GitHub repositories and production infrastructure, so the steps and warnings here come from doing it for real.

Estimate Your Build or Migration

Want a fast, line-item budget to take your Lovable app to production or extend it? Use our free calculator: https://makeanapplike.com/tools/app-cost-calculator

Prefer to have it done for you? We rebuild and migrate Lovable apps into owned, production-ready codebases through our Convert Lovable App service.

Launch Faster With a Ready-Made Foundation

Skip months of setup with a white-label, production-ready app or SaaS foundation: https://makeanapplike.com/buy-white-label-apps

Conclusion

Exporting your Lovable project to GitHub is quick, but doing it well sets up everything that follows. Connect your GitHub account, install the Lovable GitHub App, connect the project to create the synced repository, then clone it, run it locally with npm run dev, and add your Supabase keys to a .env.local. Develop on feature branches, merge to main to sync back, and never rename or delete the connected repo. Do that and your app is no longer locked in a builder; it is a real codebase you own, ready for local development, proper version control, and deployment to any host you choose.

Frequently Asked Questions

1. Can I export my Lovable project to GitHub?

Yes. Lovable has a built-in GitHub integration that pushes your entire project to a GitHub repository and keeps it in two-way sync. You connect your GitHub account, install the Lovable GitHub App, and connect your project, after which Lovable creates a repository and mirrors your code. From there the project is a normal codebase you can clone, edit locally, and deploy anywhere.

2. How do I connect Lovable to GitHub?

In Lovable, open the GitHub integration (the GitHub icon in the top right, or Settings then Connectors), connect your GitHub account via OAuth, install the Lovable GitHub App and authorize the organization you want, then connect your project. Lovable creates a repository with two-way sync enabled on the default branch. The whole flow takes a couple of minutes and only needs to be done once per project.

3. Does Lovable have two-way sync with GitHub?

Yes. Changes you make in Lovable are pushed to GitHub automatically in real time, and commits you push to the default branch on GitHub sync back into Lovable within seconds. This lets you edit in Lovable or in your own IDE and keep both in step. The important limitation is that the sync only works on the default branch, usually main.

4. Can I edit my Lovable code locally?

Yes, once it is on GitHub. Clone the repository, run npm i to install dependencies, and start the Vite dev server with npm run dev for an instant local preview with auto-reload. You can use VS Code, Cursor, or any editor. When you commit and push to the default branch, your changes flow back into Lovable, so local and Lovable editing stay consistent.

5. What tech stack does Lovable export?

A typical Lovable project is a React app built with Vite and TypeScript, styled with Tailwind CSS and shadcn/ui components, with a Supabase backend for the database, auth, and storage. Because it is a standard Vite React project, it runs and builds like any other, which is what makes it portable to GitHub and to hosts like Vercel, Render, or AWS.

6. How do I run a Lovable project locally?

Clone the repo with git clone and your repository URL, change into the folder, run npm i to install dependencies, create a .env.local with your Supabase keys, then run npm run dev. The Vite dev server starts with hot reload and an instant preview, usually on http://localhost:5173. If the app cannot reach the backend, the Supabase environment variables are almost always the reason.

7. What environment variables does a Lovable project need?

A Lovable project connecting to Supabase needs the Supabase URL, the publishable (anon) key, and usually the project ID, exposed to the client through Vite as VITE_SUPABASE_URL, VITE_SUPABASE_PUBLISHABLE_KEY, and VITE_SUPABASE_PROJECT_ID. You get these from your Supabase project settings and put them in a .env.local file that is never committed. Server-side secrets like the service-role key should never be exposed in a VITE_ variable.

8. Can I sync GitHub changes back to Lovable?

Yes, as long as you push to the default branch. Commits to main on GitHub appear in Lovable within seconds, so you can develop in your own IDE and have Lovable stay current. Work done on other branches does not sync until it is merged into the default branch, which is why the standard workflow is to develop on feature branches and merge to main.

9. What happens if I rename or delete the connected repository?

It permanently breaks the sync between Lovable and GitHub. Lovable ties the connection to the specific repository, so renaming, moving, or deleting it severs the link and is not easily recoverable. If you need a different repository name or owner, set it before connecting, and treat the connected repo as fixed once the sync is live.

10. How do I deploy my Lovable project outside Lovable?

Export it to GitHub first, then deploy that repository to any host. Because it is a standard Vite React app with a Supabase backend, it deploys cleanly to Vercel, Render, or AWS by connecting the repo and setting the same environment variables. If you are also moving the backend, you can migrate from Lovable Cloud to your own Supabase project and point the env vars at it.