Lovable — AI 全栈应用构建器¶

Lovable 完全在线使用，无需安装！

需要准备：
- 浏览器
- Lovable 账号（lovable.dev）
- 可选：Supabase 账号（用于数据库）
- 可选：GitHub 账号（用于代码同步）

1. 打开 https://lovable.dev
2. 注册账号
3. 在输入框描述你想做的应用
4. 等 AI 生成完整应用
5. 在 Design View 中可视化调整
6. 一键发布到公网

# 示例提示词：

# 做一个简单的 SaaS 应用
"做一个客户管理 CRM 系统，包含：
- 客户列表（搜索、筛选、分页）
- 客户详情页
- 添加/编辑客户表单
- 用户登录注册
- 仪表板统计"

Lovable 会生成：
- 完整的前端页面（React + TypeScript）
- 数据库表结构（Supabase）
- 用户认证系统
- CRUD 接口
- 所有页面的路由

Lovable 2.0 引入了两种模式：

Chat Mode（对话模式）：
- AI Agent 会思考和推理
- 不会立即修改代码
- 适合讨论架构、调试问题、规划功能
- 像和一个架构师聊天

Dev Mode（开发模式）：
- 直接修改代码
- 适合手动微调
- 像打开了代码编辑器

建议：先用 Chat Mode 讨论方案，
确认后切换到 Dev Mode 执行

Plan Mode 让 AI 先出方案再动手：

1. 输入需求
2. AI 生成详细执行计划
3. 你审查计划
4. 确认后 AI 才开始写代码

这避免了 AI "先斩后奏"导致改错的问题

Lovable Cloud（2025年10月发布）让你不用配置任何外部服务：

内置功能：
- 数据库（不用手动配 Supabase）
- 用户认证（注册/登录/找回密码）
- 文件存储（图片、文档上传）

使用方式：
在对话中说 "给这个应用加用户注册功能"
Lovable Cloud 自动处理所有后端逻辑

Design View 让你像用 Figma 一样编辑 UI：

可以修改的属性：
- CSS 样式（颜色、间距、字体）
- 布局（Flex、Grid）
- 组件位置和大小
- 交互效果

不需要写任何代码，拖拖拽拽就能改 UI

Lovable 和 GitHub 深度集成：

设置方法：
1. 项目设置 → 连接 GitHub
2. 选择仓库
3. 开启双向同步

工作流程：
- Lovable 的修改 → 自动推送到 GitHub
- GitHub 的修改 → 自动同步到 Lovable
- 可以在 VS Code 里改代码，变化会出现在 Lovable 中

通过 MCP 连接外部工具：

支持的集成：
- Notion — 读取产品文档
- Linear — 同步任务管理
- Figma — 导入设计稿
- Slack — 通知和协作

配置方式：设置 → Connectors → 添加 MCP 服务器

Lovable 2.0 支持最多 20 人同时协作：

功能：
- 实时多人编辑
- 每个人可以用不同的 Chat 窗口
- 操作历史可追溯
- 权限控制

适合小团队一起快速构建原型