open-lovable README

The project's README from github.com/firecrawl/open-lovable. As one markdown file: README.md.

Open Lovable

Chat with AI to build React apps instantly. An example app made by the Firecrawl team. For a complete cloud solution, check out Lovable.dev ❤️.

Open Lovable Demo

Setup

  1. Clone & Install
git clone https://github.com/firecrawl/open-lovable.git
cd open-lovable
pnpm install  # or npm install / yarn install
  1. Add .env.local
# =================================================================
# REQUIRED
# =================================================================
FIRECRAWL_API_KEY=your_firecrawl_api_key    # https://firecrawl.dev

# =================================================================
# AI PROVIDER - Choose your LLM
# =================================================================
GEMINI_API_KEY=your_gemini_api_key        # https://aistudio.google.com/app/apikey
ANTHROPIC_API_KEY=your_anthropic_api_key  # https://console.anthropic.com
OPENAI_API_KEY=your_openai_api_key        # https://platform.openai.com
GROQ_API_KEY=your_groq_api_key            # https://console.groq.com

# =================================================================
# FAST APPLY (Optional - for faster edits)
# =================================================================
MORPH_API_KEY=your_morphllm_api_key    # https://morphllm.com/dashboard

# =================================================================
# SANDBOX PROVIDER - Choose ONE: Vercel (default) or E2B
# =================================================================
SANDBOX_PROVIDER=vercel  # or 'e2b'

# Option 1: Vercel Sandbox (default)
# Choose one authentication method:

# Method A: OIDC Token (recommended for development)
# Run `vercel link` then `vercel env pull` to get VERCEL_OIDC_TOKEN automatically
VERCEL_OIDC_TOKEN=auto_generated_by_vercel_env_pull

# Method B: Personal Access Token (for production or when OIDC unavailable)
# VERCEL_TEAM_ID=team_xxxxxxxxx      # Your Vercel team ID 
# VERCEL_PROJECT_ID=prj_xxxxxxxxx    # Your Vercel project ID
# VERCEL_TOKEN=vercel_xxxxxxxxxxxx   # Personal access token from Vercel dashboard

# Option 2: E2B Sandbox
# E2B_API_KEY=your_e2b_api_key      # https://e2b.dev
  1. Run
pnpm dev  # or npm run dev / yarn dev

Open http://localhost:3000

License

MIT

open-lovable (firecrawl/open-lovable)

Searching Database…

这是什么?Open Lovable 是一款通过聊天驱动的工具,你只需指定任意网站,AI 就能在几秒内将其重建为现代的 React 应用。它是由 Firecrawl 团队构建的开源示例应用,用于展示 AI 驱动的网站克隆功能。
这是托管的产品,还是需要我自己运行的程序?它是一个可自托管的 Next.js 示例应用,你需要将其克隆到自己的机器上运行,而不是托管服务。如果想使用同一理念的全托管云端版本,README 中指向了 Lovable.dev。
我该如何让它运行起来?克隆仓库,安装依赖,将你的 API 密钥添加到 .env.local 文件中,然后启动开发服务器。
我需要设置哪些 API 密钥?你需要一个 Firecrawl API 密钥用于抓取目标网站;一个 E2B API 密钥用于沙箱代码执行,以预览生成的 React 应用;以及至少一个 AI 服务商的密钥(Anthropic、OpenAI、Google Gemini 或 Groq)。
这和 Lovable.dev 是同一个东西吗?不是。这是一个由 Firecrawl 团队构建的小型开源演示,用来展示这一理念,并不是 Firecrawl 或 Lovable 的完整商业产品。
它究竟是如何把网站转换成 React 代码的?它先使用 Firecrawl 抓取并解析目标网站的结构和内容,然后由 AI 模型生成等效的 React 组件,再通过 E2B 沙箱代码解释器运行并渲染。
我可以使用哪些 AI 模型?该项目内置了 Anthropic Claude、OpenAI、Google Gemini 和 Groq 的 AI SDK 集成,因此你可以选择任何你已有密钥的服务商。
生成的应用使用了哪些 UI 组件?它依赖 Radix UI 的基础组件(如 accordion、dialog、checkbox、avatar 等)作为所生成 React 应用的构建模块。
What are similar projects?dyad, NextChat, ai, mike, openui, quivr, trueforge, LibreChat
Creator
firecrawl
Size
0.7 MB
Stars
28.7K
Updated
CommitOct 09
Age
1y
Commits · 90 Days