
What is GitHub
Integrating GitHub into your Lovable project ensures you have full version control, collaboration tools, and code portability throughout your app’s lifecycle.TL;DR:
- Git is a version control system that tracks changes in your code.
- GitHub is the industry-standard platform for hosting Git repositories and tracking code changes, which makes it essential for both solo builders and teams using Lovable.
- By linking your project to GitHub, every change in your Lovable app is backed up in a Git repository in real time. This means you get a complete history of your code, the ability to collaborate with developers in familiar workflows, and the freedom to host or deploy your app outside of Lovable if needed.
- GitHub integration brings transparency, safety, and flexibility to your Lovable development process.
Key Benefits of GitHub Integration:
Lovable backs every project with a Git repository, making it easy for developers to push commits directly to GitHub. This means:- Version History & Backup: All your code is tracked with Git, so you can review changes or roll back to any previous state. Every commit is saved to GitHub, providing an external backup of your project
- Team Collaboration: Your code lives on GitHub where others (developers, contributors) can easily view it, comment, and contribute via pull requests. Non-technical team members can also see the code history for transparency.
- Real-Time Sync: Lovable automatically syncs with your GitHub repo. If you push code to GitHub, Lovable pulls it in almost immediately. If you edit code in Lovable, it pushes those changes to GitHub. You’ll always have the latest code in both places without manual copying.
- Workflow Integration: Use GitHub’s tools (branches, pull requests, issues, CI/CD, etc.) alongside Lovable. For example, you can run tests or deploy your app via GitHub Actions when code is merged, all while continuing to use Lovable’s editor and AI to develop features.
- Deployment Flexibility: Connecting to GitHub gives you the option to host your app on your own infrastructure or platform of choice. You’re not locked into Lovable’s hosting – you can export the code and deploy it anywhere. (Lovable will still sync changes with GitHub, so you can continue editing in Lovable even if you host the app elsewhere.)
Connecting Lovable to Your GitHub Account (Setup Guide)
Initiate GitHub Connection:
Authorize Lovable on GitHub:
Select GitHub Account/Org
Create the Repository
Verify the Link
How Syncing Works (Lovable ↔ GitHub)
Once your project is connected to GitHub, Lovable ensures that code changes stay in sync between the Lovable editor and your GitHub repository. The integration is bidirectional, but it follows some specific rules and behaviors:- Default Branch Sync Only: Lovable currently tracks only the default branch of your GitHub repository. This is typically the
main
branch (ormaster
, depending on your repo). If you push commits to other branches on GitHub, those changes will not appear in your Lovable project until they are merged into the default branch. For example, if you’re working on afeature/login
branch, Lovable won’t show those updates in the editor until you mergefeature/login
intomain
on GitHub. Similarly, Lovable will only push its changes to the default branch. Keep this in mind when using multiple branches. (See the FAQ on switching default branch if you need to change which branch Lovable syncs.) - Real-Time Updates from GitHub: When you commit and push code to the default branch on GitHub, those commits will show up in Lovable almost automatically. Lovable’s integration listens for changes – whenever you push to GitHub, Lovable pulls the latest commit into the project. You don’t need to manually refresh or import anything; the editor will reflect the new code typically within a few seconds of the push. This allows developers to work in their own environment and see the results in Lovable instantly.
- Pushing Changes from Lovable: If you make changes in Lovable (for example, editing code via Lovable’s Dev Mode or having the AI generate new code), those changes are also saved to the Git repository backing your project. Lovable will push these commits to GitHub automatically, updating the repository. In practice, you can treat Lovable as another git client – when the AI or you modify code in the Lovable editor, it’s as if you committed and pushed to GitHub. For instance, adding a new page or editing a file in Lovable will result in a commit (with the changes) appearing in the GitHub repo’s commit history. This ensures both Lovable and GitHub always have the same latest code.
- No Manual Pull/Push Needed: The sync is continuous. You do not have to manually “pull” updates into Lovable or “push” updates to GitHub – Lovable handles it. Pushing code to GitHub triggers Lovable to fetch the changes, and editing in Lovable triggers a push to GitHub behind the scenes. Your focus can be on building, not on syncing. If you ever suspect a change didn’t sync, a quick refresh of the Lovable editor or checking the GitHub repo can confirm the latest state (but in general it’s automatic).
- Conflict Handling: Because both Lovable and GitHub can change the code, there’s a chance of a git conflict if changes happen on the same file at the same time. In practice this is rare, but if a conflict does occur, you would resolve it just like any Git conflict. For example, you might need to go to the GitHub repo and manually merge or fix conflicting changes, then commit. Lovable will then pull the resolved code. To avoid conflicts, it’s best to coordinate who is editing or use branches for larger changes (merging to main when ready).
Importing an Existing GitHub Repository into Lovable
What if you already have a codebase on GitHub and want to use Lovable with it? Currently, Lovable does not yet support directly importing or linking to an existing external GitHub repo as a new project. In other words, you can’t point Lovable at an existing repository and have it pull in all that code automatically (as of now). However, there are ways to bring your existing code into Lovable:- Manual Import via a New Repo: One workaround is to create a new Lovable project and connect it to GitHub (following the setup steps above), which gives you an empty repository (or a repository with the starter code from Lovable). Then, you can manually add your existing code to that repository. For example, you could clone the new GitHub repo to your local machine, copy in the files from your old project, commit and push. Once you push your existing code into the repo’s default branch, Lovable will sync those files and you’ll see them in the Lovable editor. This effectively migrates your code into a Lovable project.
- Copy-Paste Smaller Snippets: If your project is small, you might also start a Lovable project and copy code pieces (like individual files or functions) into Lovable via the editor or the AI (for instance, by pasting code into Lovable’s code editor or prompting the AI with your code). This is less ideal for large projects but can work for minor modules.
- Planned Import Feature: The Lovable team is aware that direct repo import is a desired feature, and it’s something under consideration for future updates. Keep an eye on Lovable’s roadmap or announcements for any feature that allows importing an existing repo more directly.
Developing with GitHub and Lovable in Parallel
Once connected, you can build and edit your application using GitHub (or your local development environment) and Lovable simultaneously. This is great for developers who want to use their own tools or for teams where some members prefer coding by hand. Here are some ways to work effectively with the integration:- Viewing the Repository: In the Lovable editor, you’ll have an option to view the GitHub repository (often via a “View on GitHub” link or button). Clicking this will take you straight to the repository page on GitHub. From there, you can browse the code, open files, and even edit directly on GitHub if needed.
-
Using Local IDE or Codespaces: You can clone the GitHub repository to your local machine and open it in your favorite IDE (like VS Code, WebStorm, etc.), or use GitHub Codespaces (a cloud IDE on GitHub) for development. This means you can write and modify code outside of Lovable’s interface.
A developer on your team could clone the repo, make extensive changes with full IDE support, run tests locally, and then push commits to GitHub. Because of the integration, those commits will sync back to Lovable automatically, so the Lovable project will update to include the changes.
-
Normal GitHub Workflows: You can leverage all of GitHub’s collaboration features on your project’s repo: create branches for new features, open pull requests to review code before merging, file issues and use project boards to track tasks, etc.. Lovable doesn’t interfere with these; it simply watches the default branch for actual code changes. For instance, you might do all your work for a new feature on a
feature
branch, push it to GitHub, get it reviewed via a pull request, and then merge it tomain
. Once merged, Lovable will pull in those changes so the running app updates. This way, teams can enforce code reviews and use GitHub’s project management, while still benefiting from Lovable’s rapid development capabilities. -
Combining AI and Manual Coding: You can continue to use Lovable’s AI assistant to generate code or new components, and then inspect or fine-tune that code via GitHub. The integration allows a hybrid workflow: for example, a non-technical founder might use Lovable to scaffold a feature with AI, and a developer can then clean up or optimize that code in the GitHub repo. Both sets of changes merge seamlessly.
For example, use GitHub Actions to run tests automatically on each pull request, or to deploy the app to a hosting service whenever
main
gets updated - Remember: even while doing heavy development through GitHub, you can always go back to the Lovable editor to use the visual tools or AI chat for assistance. The codebase is the same, so any changes you made by hand will be present in Lovable. This integration makes Lovable a part of your toolchain rather than an isolated environment.
Documenting Changes and Rolling Back
Working with GitHub encourages good software development practices like documenting changes and managing versions. Here are some tips on managing your code changes and reverting when necessary:- Use Meaningful Commit Messages: Whenever you commit changes (especially when committing via a local IDE or GitHub’s interface), write a clear commit message describing what you changed and why. For example,
"Fix signup form validation bug"
is much more useful than"update code"
. Good commit messages help team members (and your future self) understand the history of the project. They serve as documentation for the evolution of your app. If Lovable’s AI made a lot of changes in one go, consider breaking them into logical commits with messages for each major change, if you’re doing it manually. If commits are being generated automatically, you can always squash or edit them later on GitHub for clarity. - Track Versions in Lovable: Lovable provides a version history in the editor (similar to Google Docs revision history) that keeps track of changes made through the platform. You can access the version history panel to see previous states of your project and even restore an earlier version with one click. This is effectively a “rollback” feature built on top of Git – if something goes wrong after an AI-generated change or an edit, you can revert to a known good state. It’s a quick way for non-developers to undo mistakes without using GitHub directly.
- Rolling Back with Git or Lovable (Reverts): Since your project is under Git, you can perform rollbacks by reverting commits on GitHub as well. For example, if a certain commit introduced an issue, you (or a developer) can click “Revert” on GitHub for that commit, or use
git revert
locally and push. This will create a new commit that undoes the changes of the bad commit. Lovable will sync this revert commit and your project will go back to the previous behavior. Always test your app after a revert to ensure the issue is resolved and no other functionality is affected. - Use Branches for Big Changes: A good strategy to reduce the need for rollbacks is to use feature branches for major changes. You might develop a big feature on a separate branch and only merge it to the main branch (which Lovable uses) after it’s fully tested. This way, your main branch (and the live app in Lovable) stays stable, and you only introduce changes when they are ready. If something on the feature branch isn’t working, it doesn’t affect your production code in Lovable until merged.
- Documentation of Changes: If you are collaborating with others or handing off the project, consider maintaining a brief changelog or using GitHub’s release notes. While commit messages are the primary log, summarizing changes in human-readable form (e.g., “Implemented user authentication, updated UI for profile page, fixed payment bug”) can be helpful for non-technical stakeholders to follow progress. You can do this in a Markdown file in the repo or in GitHub Releases.
- Lovable’s Rollback Feature: Lovable automatically backs up your project, so if you made a mistake, you can use the built-in rollback in the Lovable interface to undo accidental changes. This is essentially using Git version control under the hood. It ensures that even non-technical users have a safety net – you don’t have to be a Git expert to restore a previous version of your app. However, for complex version management (like maintaining multiple versions or doing partial rollbacks), you will likely use GitHub’s tools.
Troubleshooting & FAQ (GitHub Sync)
Below are some common questions and issues that users encounter with the GitHub integration, along with guidance on how to resolve them. Click on a question to view the answer.Why aren’t my commits showing up in Lovable?
Why aren’t my commits showing up in Lovable?
main
or master
). If you committed to a different branch and haven’t merged those changes into the default branch, Lovable will not see them. To fix this, merge the branch into the default branch (or change the default branch – see the next question). Once the commit is on the default branch, Lovable should pull it in automatically.Another possibility is an issue with the integration link. For instance, if you renamed the GitHub repository or changed your GitHub username after connecting, the webhook/connection might be broken. In such cases, reconnecting your GitHub account to Lovable can re-establish the link. Make sure the Lovable GitHub App still has access to the repo (check your GitHub settings → Applications). If it was removed or lost access, re-authorize it and then try pushing the commit again.Also, double-check that the commit was successfully pushed to GitHub (not just committed locally). If you haven’t run git push
(in case of local development), the commit won’t be on GitHub for Lovable to detect.If your commits are on the default branch and you still don’t see updates in Lovable, try manually refreshing the project in the Lovable editor. In rare cases, there might be a slight delay or a hiccup in the webhook. Usually, though, commits appear almost instantly when everything is set up correctly.How do I switch the default branch that Lovable syncs with
How do I switch the default branch that Lovable syncs with
main
(for new GitHub repos) unless you changed it. If you want Lovable to track a different branch (say you want to use a development
branch as the main source), you need to change the default branch on GitHub:- On GitHub: Go to your repository’s Settings > Branches > Default branch. Choose the branch you want to set as the new default, and confirm the change. (If the branch doesn’t exist yet, you’ll need to create it and perhaps populate it with the current code.)
- After Changing: Once you set a new default, Lovable should start treating that branch as the one to sync. Since Lovable only tracks the default branch, changing it effectively points Lovable to the new branch. Give it a moment to fetch the code from the new default branch. All future commits to that branch will sync to Lovable, and edits in Lovable will be pushed to that branch.
- Verify in Lovable: Check the Lovable editor to ensure it’s now showing the code from the new default branch. You might see an update notification or you might simply notice that any differences (if the branch had different code) are now reflected. If it doesn’t seem to update, try disconnecting and reconnecting the GitHub integration in Lovable (as a last resort). But typically, this isn’t required — it should follow the default automatically.
- Merge Old Changes: A crucial step is to make sure any important commits from the old default branch get merged into the new default. Changing the default branch on GitHub does not automatically merge the content. If you switched default branches because you want to shift development to a new line of work, ensure that the new branch has all the latest code. You may need to merge the previous main into the new branch so nothing is lost. After merging, Lovable will show the combined changes.
How does Lovable detect new commits from GitHub?
How does Lovable detect new commits from GitHub?
Can I host my Lovable app myself after connecting to GitHub?
Can I host my Lovable app myself after connecting to GitHub?
How do I switch the GitHub account if I already connected the wrong one?
How do I switch the GitHub account if I already connected the wrong one?
- Remix the Project: In Lovable, click the “Remix” button on your project to create a new copy of it.
- Connect to GitHub: Once remixed, connect this new project to GitHub.
- Select the Correct Organization: During the GitHub connection process, you’ll have the option to choose the correct organization and complete the necessary configuration steps.
How do I update my GitHub if I move my repository into an organization from a personal account?
How do I update my GitHub if I move my repository into an organization from a personal account?
- Move the repository back to its original location (the personal account it was connected from).
- Once the sync is restored and you’re able to access the project again, remix the project in Lovable.
- With the remixed version:
- Connect to GitHub using the desired organization.
- Authorize the Lovable GitHub App for the new org (admin access required).
- Choose the target repo (either the moved one or a new repo).
- Lovable cannot switch GitHub accounts or orgs mid-project due to how sync is configured.
- Remixing is the only way to point a project to a different GitHub org.
I changed my GitHub repo name. How do I fix my project?
I changed my GitHub repo name. How do I fix my project?
I changed my GitHub username, how do I fix my project?
I changed my GitHub username, how do I fix my project?
I changed my GitHub organization name. How do I fix my project?
I changed my GitHub organization name. How do I fix my project?
I deleted my repo in GitHub. How do I recover it?
I deleted my repo in GitHub. How do I recover it?
- Go to GitHub’s repository restoration page and follow the instructions to restore your deleted repository.
- GitHub allows you to restore a deleted repo within 90 days, provided no other repository with the same name exists in the same account or organization.
- Once your repository has been successfully restored on GitHub, your Lovable project should automatically sync back with it, and you’ll be able to continue development and syncing as before.
I deleted my GitHub account. What now?
I deleted my GitHub account. What now?
- All projects connected to your deleted GitHub account will not work and you cannot push or sync any code.
- Your repository history and webhooks are lost.
- Lovable cannot automatically reconfigure or repair these projects.
- Reach out to Lovable Support and ask if they can mannually disconnect your deleted GitHub account.
- If support is able to do this, you can then start fresh with a new GitHub account.
- However, none of your old projects will be recoverable or usable.
- Create a new GitHub account.
- Connect these new projects to your new GitHub account.
Can I undo or disconnect my GitHub integration?
Can I undo or disconnect my GitHub integration?
Do I have to remix a project to switch GitHubs?
Do I have to remix a project to switch GitHubs?
I don't want any accidental changes to happen on my project. How do I remove Lovable from my GitHub?
I don't want any accidental changes to happen on my project. How do I remove Lovable from my GitHub?
- Go to your GitHub settings.
- Navigate to Applications (or
Setting
→Applications
→Authorized OAuth Apps
). - Find the Lovable GitHub App in the list.
- Click Revoke or Remove to completely disconnect Lovable from your GitHub account.
- Go to your GitHub settings and find the Lovable app.
- Modify the permissions to “Only select repositories” instead of “All repositories”.
- Remove access to the repositories you want to protect.
- Lovable will no longer be able to push changes to your GitHub repositories.
- No new commits will be created from Lovable edits.
- Your existing code on GitHub remains completely safe and unchanged.
- You can still continue working in Lovable, but changes won’t sync to GitHub.