V-APIbeta
ВойтиРегистрация

Open Lovable：开源 AI 建站神器，一句话克隆任意网站

V-API2026-06-20

一个开源的 Lovable.dev 替代品，由 Firecrawl 团队打造。和 AI 聊聊天，就能把一个网站「克隆」成现代化的 React 应用。

它是什么

Open Lovable 是 Firecrawl 团队开源的一款 AI 驱动的 React 应用生成器。它的核心理念非常直接：你不需要从零写代码，只要用自然语言描述你想要的东西，或者直接丢给它一个网址，AI 就会帮你把对应的 React 应用生成出来——而且是秒级的。

它本质上是商业产品 Lovable.dev 的一个自托管开源替代方案，采用 MIT 协议。截至目前，项目在 GitHub 上已经收获了 26.8k+ Stars 和 5.1k+ Forks，是一个相当受关注的开源项目。

open lovable

它能做什么

简单概括，Open Lovable 把「克隆并重建一个网站」这件事自动化了：

  • 对话式构建：在聊天界面里描述你的应用需求，AI 帮你生成对应的 React 代码。
  • 网站克隆：借助 Firecrawl 的网页抓取能力，它能提取一个现有网站的结构与内容，然后用 AI 在几秒内把它重建成一个现代化的 React 应用。
  • 实时预览与运行：生成的代码会在沙箱环境中执行，你可以立刻看到效果。
  • 持续迭代：通过继续对话来修改、完善生成的应用。

核心特性

特性说明
🤖 多模型支持兼容 Google Gemini、Anthropic Claude、OpenAI、Groq
📦 灵活的沙箱支持 Vercel Sandbox（默认）和 E2B 两种代码执行环境
⚡ Fast Apply可选接入 Morph LLM，加速代码编辑应用
🕷️ 网页抓取集成 Firecrawl API，提取目标网站的结构与内容

技术栈

Open Lovable 本身是一个标准的现代前端项目：

  • 框架：Next.js
  • 语言：TypeScript（占比约 95%）
  • UI：React + Tailwind CSS（搭配 PostCSS）
  • 包管理：支持 pnpm / npm / yarn
  • 运行时：Bun

它是怎么工作的

可以把整个流程理解为三步：

  1. 抓取（Firecrawl）：当你给出一个网址时，Firecrawl 负责把目标页面的内容和结构抓取下来，转换成 AI 易于理解的格式。
  2. 生成（LLM）：你选择的大模型（Claude / Gemini / OpenAI / Groq）根据抓取结果或你的文字描述，生成 React 组件代码。
  3. 执行（Sandbox）：生成的代码被放进 Vercel 或 E2B 的沙箱中实时运行，你立即看到可交互的预览，并能继续对话迭代。

如果配置了可选的 Morph LLM，编辑应用的速度还能进一步提升（Fast Apply）。

快速上手

1. 克隆并安装依赖

git clone https://github.com/firecrawl/open-lovable.git
cd open-lovable
pnpm install   # 或 npm install / yarn install

2. 配置环境变量

在项目根目录创建 .env.local 文件：

# 必填：Firecrawl API Key —— https://firecrawl.dev
FIRECRAWL_API_KEY=your_key
 
# AI 模型（四选一即可）
GEMINI_API_KEY=...      # https://aistudio.google.com/app/apikey
ANTHROPIC_API_KEY=...   # https://console.anthropic.com
OPENAI_API_KEY=...      # https://platform.openai.com
GROQ_API_KEY=...        # https://console.groq.com
 
# 可选：更快的编辑应用
MORPH_API_KEY=...        # https://morphllm.com/dashboard
 
# 沙箱环境（vercel 为默认，或 e2b）
SANDBOX_PROVIDER=vercel

关于沙箱配置：

  • Vercel 沙箱：推荐用 vercel env pull 拉取 VERCEL_OIDC_TOKEN；或者手动配置 VERCEL_TEAM_ID、VERCEL_PROJECT_ID、VERCEL_TOKEN。
  • E2B 沙箱：配置 E2B_API_KEY（从 https://e2b.dev 获取）。

3. 启动开发服务器

pnpm dev   # 或 npm run dev / yarn dev

然后访问 http://localhost:3000 就可以开始和 AI 对话构建应用了。

适合谁用

  • 想快速验证想法的开发者：把一个参考网站丢进去，几秒拿到可运行的 React 脚手架。
  • 学习者：观察 AI 如何把需求拆解成组件，是不错的学习材料。
  • 希望掌控数据与成本的团队：相比商业 SaaS，自托管 + 自带 API Key 的模式让你对模型选择和费用有更多控制权。

小结

Open Lovable 把「AI 抓取网页 → 大模型生成代码 → 沙箱实时运行」这条链路打通，并且全部开源。它的亮点在于模型与沙箱都可自由选择，既能用 Claude、Gemini 这样的顶级模型，也能在 Vercel 或 E2B 之间切换运行环境。如果你对 AI 辅助开发、网站克隆或者「Vibe Coding」感兴趣，这是一个非常值得动手试一试的项目。

项目地址：https://github.com/firecrawl/open-lovable （MIT 协议）