> ## Documentation Index
> Fetch the complete documentation index at: https://docs.superblocks.com/llms.txt
> Use this file to discover all available pages before exploring further.

# Lovable import

> Migrate a Lovable app into Superblocks with Clark

Import a Lovable app into Superblocks and turn your prototype into a production-ready application connected to your enterprise data, with platform-managed authentication and RBAC.

## Before you begin

Make sure you have:

* A Lovable project you want to migrate
* Access to the Superblocks workspace where the app will live
* The integrations (databases, APIs) you plan to connect already configured in Superblocks

## How to import from Lovable

<Steps>
  <Step title="Start the import">
    From the Superblocks home screen, click **Import** in the prompt bar, or click the **Import an app** link below it.
  </Step>

  <Step title="Select Lovable as your source">
    When prompted to choose a platform, select **Lovable**.
  </Step>

  <Step title="Export your project from Lovable">
    Superblocks provides a ready-made export prompt. Copy it and paste it into the Lovable chat — Lovable will build you a `LovableExport.zip`. Download the zip from Lovable once it's ready.

    <img src="https://mintcdn.com/superblocks/U5RkhXSSu8k-JEr-/images/import-apps/lovable-export.png?fit=max&auto=format&n=U5RkhXSSu8k-JEr-&q=85&s=4b56c3273612413539feda8a1b1efe78" alt="Superblocks migration Export step for Lovable: copy export prompt, build LovableExport.zip in Lovable chat, then download" style={{ width: "100%", maxWidth: "720px" }} width="1992" height="1050" data-path="images/import-apps/lovable-export.png" />
  </Step>

  <Step title="Upload the zip">
    Drop the downloaded zip file into the Superblocks upload area and click **Import**.

    <img src="https://mintcdn.com/superblocks/U5RkhXSSu8k-JEr-/images/import-apps/upload-project.png?fit=max&auto=format&n=U5RkhXSSu8k-JEr-&q=85&s=4a69e8878e34f02320c597e930dbd593" alt="Migration Upload step: drag-and-drop zone for .zip, .tgz, or .gz archives with Import app button" style={{ width: "100%", maxWidth: "720px" }} width="1996" height="1052" data-path="images/import-apps/upload-project.png" />
  </Step>

  <Step title="Clark migrates the app">
    Clark inspects your project structure and imports what it can, including:

    * **Code** — your app's source files and logic
    * **Design and styles** — layouts, component styles, and visual structure
    * **Backend functionality** — any server-side logic Clark detects

    Clark then rewrites the code to run on Superblocks:

    | Lovable                        | Superblocks                                                                |
    | ------------------------------ | -------------------------------------------------------------------------- |
    | Supabase client and queries    | [Integrations](/integrations/overview) connected to your databases         |
    | Hardcoded API keys and secrets | Credentials managed by the platform                                        |
    | Supabase Auth                  | Platform-managed [authentication and RBAC](/admin/org-administration/rbac) |
    | React pages and components     | React pages hosted on the platform, preserving your design and styles      |

    You'll be prompted to connect your integrations — pick the databases, APIs, and services the app should use in your environment.
  </Step>
</Steps>

## What gets migrated

Clark analyzes the Lovable source code and replaces external dependencies with Superblocks platform features. Most React components, layouts, and styles migrate as-is. Logic that depends on Supabase or other Lovable-specific services is rewritten to use your connected integrations.

## Troubleshooting

**The zip won't upload** — Make sure the zip contains your project's root folder and excludes `node_modules`, `.git`, and build output directories. Re-run the export prompt in Lovable if needed.

**Some components look different after migration** — Clark preserves styles where possible, but some Lovable-specific UI libraries may not have a direct equivalent. You can edit any component directly in Superblocks after the import completes.

**Integrations aren't connecting** — Verify that the integration is configured in your Superblocks workspace before importing. You can add integrations from the [Integrations page](/integrations/overview) and then reconnect them from within the imported app.
