# Lovable八招：别从零建，别瞎烧钱 **导语**：海外有个叫 Lovable 的建站工具，聊天框里打一句话就能生成一个能跑的全栈 Web 应用——据 TechCrunch 等多家海外媒体报道，它 2025 年用 8 个月做到 1 亿美元年经常性收入（ARR），是当时增长最快的软件公司之一。但国内大部分人对它的认知还停留在“一句话生成网页”的演示视频上。真正的差距在操作层：老外玩家已经把它的模式切换、代码直改、公共项目克隆、GitHub 混编玩成了一套“省 credit 上线流”。这篇文章把 8 个中文圈几乎没人写的暗门一次拆完，每一个都能立刻上手。 ## 一、先认识一下这个“聊天框建站厂” Lovable（官网 lovable.dev），前身是大名鼎鼎的开源项目 GPT Engineer，创始人 Anton Osika，公司放在瑞典斯德哥尔摩。它的核心玩法是：你用自然语言描述想要的应用，它直接生成前端页面 + 后端逻辑 + 数据库，预览即所得，改一句更新一版。 为什么值得中国开发者关注？三个理由： 1. **出海验证利器**。想做一个面向海外的小工具、SaaS、落地页，Lovable 是目前“从想法到可上线产品”路径最短的工具之一； 2. **生态位置特殊**。它不是 IDE，而是“AI 全栈承包商”，和 Cursor、Claude Code 这类本地工具是互补关系——这点后面第 6 招会重点讲； 3. **中文深度教程极度稀缺**。YouTube 和 Reddit 上关于 Lovable 的进阶玩法讨论已经很密，中文圈还停留在入门演示。 价格方面：免费档每天送若干 credit（平台的算力点数，每条改代码的消息消耗 1 个），付费 Pro 档每月 25 美元上下，具体以官网实时定价为准。credit 就是你的弹药，下面 8 招里有 5 招都在教你省子弹。 ## 二、八个暗门，一个一个拆 ### 第1招：三种模式分工，别一根筋用默认模式 **操作**：输入框旁边有个模式切换器，把鼠标移上去会看到三个选项——默认（Default）、Chat Mode（聊天模式）、Agent Mode（智能体模式）。 - **Chat Mode**：只讨论、不写码。它会追问你需求细节、帮你梳理方案，确认前不动代码； - **Agent Mode**：自治多步执行，适合“加用户系统”“接支付”这种拆成十几步的大活，它自己列计划自己跑； - **默认模式**：常规小步迭代。 **预期效果**：方向没想清时先在 Chat Mode 里把需求聊透，再切回默认模式执行，避免“模糊需求→生成歪楼→反复重试”的三重烧钱。 **适用场景**：需求边界模糊的新功能；想先问“能不能做、怎么做”再动手的时候。 ### 第2招：Select & Edit，用手指头点着改 **操作**：预览页右上角开启 Select & Edit（点选编辑），然后直接**用鼠标点页面上的任意元素**——按钮、标题、卡片——再在弹出的输入框里说“把这个按钮改成绿色、圆角加大”。 **预期效果**：AI 精准锁定你点的那个元素，不会整页重画。改个文案、挪个位置这类小活，这是最省 credit 的路径。 **适用场景**：UI 细节微调。“帮我改下首页”这种模糊指令是烧 credit 大户，点选之后一句话的事。 ### 第3招：Dev Mode 手改代码，一次 credit 都不烧 **操作**：切换到 Dev Mode（代码视图），直接看到整个项目的源码。小改动——比如改个字符串、调个 CSS 数值——手动改完保存即可。 **预期效果**：手改代码**不消耗 credit**。这是官方文档里明确的行为，但大量新用户不知道，把 Lovable 当成“只能聊天的黑盒”，改一个错别字也发消息，子弹哗哗往外飞。 **适用场景**：你本来就会写代码。改文字、改样式、改配置这类活，手速比 AI 快，还免费。 ### 第4招：Knowledge Base，给 AI 立规矩 **操作**：项目设置（Project Settings）里找到 Knowledge Base（知识库），把项目的技术栈约定、禁止事项写进去，比如“统一使用 Tailwind，不要引入其他 UI 库”“配色遵循已定稿的品牌色”“所有接口错误要弹 toast 提示”。 **预期效果**：AI 在后续每一次生成中都遵守这些约定，不会每次迭代都“换风格、换组件库、改配色”。风格漂移（drift）是聊天框建站最大的隐性成本——每次纠正漂移都在烧 credit。 **适用场景**：所有打算长期迭代的项目。开新项目第一件事就写知识库，五分钟投入，后面每一轮对话都在回本。 ### 第5招：Remix，别从零开始建 **操作**：Lovable 有个公共项目广场（Explore/Discover），大量用户把自己的项目开源了出来。看中哪个，点 **Remix**，一键把别人的项目完整复制成你的私有副本，然后在其基础上改。 **预期效果**：起手就是一个能跑的成熟骨架。社区里现成的 Landing Page、Dashboard、SaaS 模板一抓一大把，比从“帮我建一个用户管理后台”开始省 80% 的前期 credit。 **适用场景**：任何常见形态的产品——落地页、后台、工具站。先去广场搜同类，有像样的就 Remix，实在没有再从零建。这一招是老外玩家和 demo 玩家最大的分水岭。 ### 第6招：GitHub 双向同步，和本地工具混编 **操作**：项目页点 Connect GitHub，授权后代码自动同步到一个 GitHub 仓库。之后本地 `git clone` 下来，用 Claude Code、Cursor 想怎么深改就怎么深改；改完 push 回去，Lovable 会拉取你的提交，继续在最新代码上陪你聊。 **预期效果**：这是整套玩法里信息差最大的一招——**Lovable 负责起骨架和快速迭代，本地 Agent 负责深水区硬仗**，两边靠 GitHub 打通。国内很多人以为选了 Lovable 就被锁死在聊天框里，实际上它是个开放的“前端基地”。 **适用场景**：复杂业务逻辑、性能优化、大规模重构——这些活交给本地工具；页面搭建和快速试错留给 Lovable。 ### 第7招：Lovable Cloud，后端一键接管 **操作**：需要数据库、用户登录、文件上传时，直接说“加上用户注册登录功能”，Lovable 会提示启用 **Lovable Cloud**（底层就是 Supabase），一键开通。数据库表、认证流程、存储桶、甚至行级安全策略（RLS）都由 AI 自动生成和配置。 **预期效果**：传统建站流程里“注册 Supabase→建项目→写 Schema→配 Auth→写 RLS 策略”半小时的活，压缩成几分钟对话。这是 Lovable 和 Supabase 官方深度合作的产物，也是它区别于纯前端生成器的护城河。 **适用场景**：任何需要“真用户、真数据”的产品，而不是一张静态演示页。 ### 第8招：上线前跑一次 Security Review **操作**：项目设置里有一键 **Security Review**（安全审查），上线前点一次，它会检查行级安全策略有没有配漏、API 密钥有没有暴露在前端代码里、权限有没有越界的口子。 **预期效果**：AI 生成代码又快又猛，但安全细节恰恰是它最容易翻车的地方——尤其是 Supabase 的 RLS 没配好等于数据库裸奔。花一次检查，换来不把用户数据挂在网上。 **适用场景**：每一次准备对外发布前。这是全流程里最不该省的一步。 ### 加赠：省 credit 口诀 Reddit 上 r/Lovable 社区反复被验证的经验，浓缩成四句：**小步快跑，一次只提一件事；报错贴截图，别用文字描述报错；失败了换说法重试（Try a different approach），别反复点重摇；纯聊天去 Chat Mode，别在编辑模式里闲聊。** ## 三、一张图看懂完整工作流 ```mermaid flowchart TD A["需求进来"] --> B{"这活多大？"} B -->|方向还没想清| C["Chat 模式先聊透"] B -->|只改样式文案| D["点选编辑精准改"] B -->|多步大活| E["Agent 模式接管"] B -->|常规小功能| F["默认模式 小步发"] C --> F D --> G{"结果满意？"} E --> G F --> G G -->|不满意| H["换说法重试
别反复重摇"] H --> F G -->|满意| I["Dev Mode 手改微调
不烧credit"] I --> J["接GitHub双向同步"] J --> K["跑一次安全审查"] K --> L["绑域名上线"] ``` ## 四、和国内同类工具比，差距在哪 国内对标产品不少：字节 Trae、腾讯 CodeBuddy、各家云厂商的“一句话建站”都能做类似的事。但体验过 Lovable 之后会发现差异不在生成质量，而在**三件周边事**上： 1. **Remix 公共项目生态**——类似 Figma Community 的“抄作业”文化，社区模板浓度极高，国内产品几乎没有对等的公开项目广场； 2. **Supabase 深度绑定**——后端三件套（库、认证、存储）一条龙，而不是只生成一个前端壳； 3. **对本地工具链开放**——GitHub 双向同步做得干脆，不把你锁在自己的闭环里。 国内产品强在访问无门槛、中文生态和价格；Lovable 强在海外部署链路和社区资产。做出海项目用后者，做国内项目用前者，目前看是合理分工。 ## 五、信息差总结 | 维度 | 你以为的 | 实际上 | |------|---------|--------| | 定位 | 一句话生成网页的玩具 | 可交付全栈产品的“AI 承包商”，8 个月做到 1 亿美元 ARR（据 TechCrunch 报道） | | 改 UI | 只能发消息让 AI 改 | Select & Edit 点选改，Dev Mode 手改不烧 credit | | 起步 | 每个项目从零生成 | Remix 公共项目，站在别人肩膀上开工 | | 协作 | 被锁死在聊天框 | GitHub 双向同步，和 Claude Code/Cursor 混编 | | 后端 | 只能做静态页面 | Lovable Cloud（Supabase）一键搞定库、登录、存储 | | 安全 | 上线直接裸奔 | 官方一键 Security Review，专查 RLS 和密钥泄露 | ## 六、行动指南 1. **今天**：注册 lovable.dev（免费档就够练手），先去公共项目广场逛 10 分钟，找一个 SaaS 模板点 Remix； 2. **本周**：把自己的一个搁置已久的想法，用“知识库立规矩 → Chat Mode 聊透 → 默认模式小步建”的顺序跑出 MVP； 3. **本月**：接到 GitHub，本地用 Claude Code 深改一轮业务逻辑，跑完 Security Review 后绑域名上线； 4. **进阶**：把你在第 2 步沉淀的 prompt 约定整理成自己的“建站 SOP”，接单或者做独立产品都用得上。 一句话收尾：工具的差距从来不在于它能不能一键生成，而在于你知道它哪八个按钮藏在哪。这八个暗门，够你把别人演示视频里的东西变成自己账上的产品。 ## 参考来源 1. Lovable 官网（产品入口与实时定价）：https://lovable.dev 2. Lovable 官方文档（模式切换、Dev Mode、Knowledge Base、GitHub 同步）：https://docs.lovable.dev 3. Lovable 官方博客（产品更新与安全审查功能说明）：https://lovable.dev/blog 4. Supabase 官网（Lovable Cloud 底层平台）：https://supabase.com 5. TechCrunch 对 Lovable 增长里程碑的报道（8 个月 1 亿美元 ARR）：https://techcrunch.com --- > 本文由「51学通信」技术团队出品。51学通信由通信行业18年老兵**爱卫生**（微信ID: gprshome201101）维护。 > 聚焦5G/6G核心网、3GPP标准、AI工具实战。知识星球「51学通信」提供深度技术答疑和行业洞察。 > [!tip] 51学通信知识星球 > **星主：爱卫生**（微信：gprshome201101）——公众号「51学通信」创办者，19 年通信行业运维与讲师经验，著有《GPRS网络信令实例详解》《EPC原理与实践》《5G核心网原理与实践》三本纸质书（各大电商平台有售）。 > **星球定位**：深耕 5G 核心网、IMS、NFV/AI、云原生等 ICT 领域，主打运维岗位与信令分析。 > **当前规模**：5200 篇主题 / 990 个回答，198 元/年。 > **加入福利**：加入星球后请加爱卫生微信，拉您进知识星球年度陪伴与答疑群——不限量回复您的各种问题，另有群内分享。 > **AI 加持**：51学通信知识星球已作为 skill 接入 WorkBuddy，使用 deepseek-4-flash 在海量星球帖子中精准找贴、找视频、找 FAQ 和案例，做总结、找文档和 PPT 等场景全覆盖。