Lovable Stack

Build Lovable AI projects locally without configuration stress.

Lovable Stack is a Bun-powered project generator that recreates the working stack behind projects generated by Lovable AI, so you can run, edit, and fully own your code locally. It does the heavy setup for you — you focus on building.

Quick Start

1. Create a new project:

bunx lovable-stack my-app

Enter the project folder:

cd my-app

Install dependencies:

bun install

Start the development server:

bun run dev

Your app is now running locally.

Why Lovable Stack?

AI builders are amazing for speed. You can:

Generate a full demo site in minutes

Connect GitHub

Ship ideas fast

But when you clone that project locally, you may face:

Dependency issues

Runtime conflicts

TypeScript strict errors

Missing configuration alignment

Bun lock visible packages

Lovable Stack fixes that. It scaffolds a clean, aligned local environment so your project runs properly on your machine.

What You Get

Lovable Stack creates a fully configured project using:

Bun

React + Vite

TypeScript

Tailwind CSS

shadcn/ui

Radix UI

Everything is preconfigured and version-aligned. No manual wiring. No rebuilding the stack from scratch.

Requirements

Before using Lovable Stack, install:

Bun (latest version)

Basic knowledge of React & TypeScript

Install Bun (MacOS/Linux):

curl -fsSL https://bun.sh/install | bash

Install Bun (Windows):

powershell -c "irm bun.sh/install.ps1|iex"

Visit Bun website: https://bun.com/docs/installation

How To Use With Lovable AI

Generate your project using Lovable AI.

Copy your generated components (e.g., header.tsx, hero.tsx).

Paste them into /src/components inside your Lovable Stack project.

Continue building locally.

Now you own your code and environment.

Project Structure my-app/ ├── src/ │ ├── components/ │ ├── pages/ │ └── main.tsx ├── public/ ├── tsconfig.json ├── vite.config.ts └── bun.lock

Everything is already wired together.

Common Errors & Fixes

TypeScript “must be imported as type” error

If you see an error about importing types incorrectly, use:

import { NavLink as RouterNavLink } from "react-router-dom"; import type { NavLinkProps } from "react-router-dom";

Instead of:

import { NavLinkProps } from "react-router-dom";

This project uses strict TypeScript settings.

Reporting Issues

If you encounter an error not listed here:

Open a GitHub Issue

Include:

Your OS

Bun version

Full error message

Screenshot (if possible)

This helps improve Lovable Stack for everyone.

Philosophy

AI helps you move fast. Lovable Stack helps you move correctly.

It’s built for developers who want:

Speed without losing control

AI assistance without dependency confusion

A stable local development environment

This project is designed to work alongside Lovable AI projects. It is not affiliated with or endorsed by Lovable.

Contributing

Contributions are welcome:

Fork the repository

Create a new branch

Submit a pull request

If you’ve solved an issue or improved the developer experience, feel free to contribute.