ARTICLE · INTELLIGENCE

战地情报 · 详情页

来自尧图项目组的一线实战观察与深度解析

Vibe Coding全栈开发实战:智能体驱动从规格到代码

Vibe Coding全栈开发实战:智能体驱动从规格到代码 1. 从“写代码”到“聊需求”Vibe Coding 到底改变了什么第一次听到“Vibe Coding”这个词是在一个做全栈开发的朋友群里。有人甩了张截图说他用自然语言描述了一个后台管理系统的需求智能体在几分钟内生成了前端页面、后端接口和数据库迁移脚本他只需要点几下确认。群里瞬间炸了锅有人觉得这是噱头有人已经开始研究怎么接入自己的项目。我当时的反应是这不就是把“低代码平台”换了个说法吗但真正上手试了两周之后我改变了看法。Vibe Coding 和传统低代码平台有本质区别——低代码平台给你的是拖拽组件和固定模板而 Vibe Coding 给你的是一个能理解上下文、能跨文件修改、能根据反馈迭代的智能体协作环境。你不再需要记住某个框架的 API 怎么写而是把精力放在“我要做什么”和“这样做对不对”上。这篇文章适合三类人看一是正在做全栈开发、想提升效率的工程师二是对智能体驱动开发感兴趣、但不知道从哪下手的技术管理者三是已经用过一些 AI 编程工具、但觉得“也就那样”的开发者。我会从整体设计思路、核心细节、实操过程、常见问题四个维度把 Vibe Coding 全栈开发这件事拆开揉碎讲清楚。全文基于我自己的项目实践和踩坑记录不保证覆盖所有场景但保证每一条都是真实可复现的。2. 整体设计与思路拆解为什么是“智能体驱动”而不是“AI 辅助”2.1 传统 AI 辅助编程的瓶颈在哪里过去两年大家用 AI 写代码的方式基本是打开一个对话窗口把需求描述一遍AI 吐出一段代码复制粘贴到编辑器里运行报错再复制错误信息回去问来回几轮之后代码能跑了但结构一塌糊涂。这种方式我称之为“单次问答式辅助”它有三个致命问题。第一是上下文断裂。AI 看不到你项目的完整结构不知道你已有的工具函数、数据库连接方式、路由组织习惯。它生成的代码往往需要大量手工适配适配成本有时候比从头写还高。第二是缺乏工程约束。AI 不知道你的代码规范、测试覆盖率要求、部署流程生成的东西能跑但不符合工程标准。第三是迭代效率低。每次修改都要重新描述背景对话历史一长AI 就开始“遗忘”前面的约定。我试过在一个中型项目里用这种方式开发一个用户权限模块前后对话了四十多轮最后生成的代码虽然能跑但和项目原有的权限体系完全不兼容重构花的时间比直接写还多。这就是“AI 辅助”的天花板——它是个工具不是协作者。2.2 智能体驱动开发的核心差异Vibe Coding 的思路完全不同。它不是让你和 AI 对话而是让你指挥一组智能体去干活。每个智能体有明确的角色分工有的负责理解需求并拆解任务有的负责生成代码有的负责审查代码质量有的负责跑测试并反馈结果。你做的事情是“定义目标、审核产出、调整方向”而不是“逐行描述实现”。这种模式能成立依赖三个技术前提。一是大模型的长上下文能力足够强能一次性吞下整个项目的关键文件二是智能体框架支持工具调用能读写文件、执行命令、调用外部 API三是工程化约束能被编码成智能体的行为规则比如“所有数据库操作必须走 ORM”“新增接口必须补单元测试”。我目前用的方案是基于一个开源智能体框架做二次开发核心是把项目结构、编码规范、部署流程写成配置文件让智能体在每次生成代码前先读取这些约束。实测下来生成代码的可用率从最初的不到 30% 提升到了 70% 以上剩下的 30% 主要是业务逻辑边界情况需要人工确认。2.3 SDD 在其中的角色规格驱动开发不是新概念但这次不一样SDDSpecification-Driven Development规格驱动开发这个概念其实不新传统软件工程里一直有“先写规格再写代码”的说法。但在 Vibe Coding 的语境下SDD 被赋予了新的含义规格不再是给人看的文档而是给智能体执行的指令集。具体来说我会把每个功能模块写成一份结构化的规格文件包含功能描述、输入输出定义、边界条件、依赖关系、验收标准。这份文件既是智能体的任务书也是后续自动化测试的输入。智能体根据规格生成代码测试智能体根据规格生成测试用例审查智能体根据规格检查实现是否完整。这样做的好处是当需求变更时我只需要改规格文件然后让智能体重新生成受影响的代码和测试。整个过程像流水线一样而不是像以前那样到处找哪里需要改。我试过一个中等复杂度的订单模块需求变更了三次每次改规格后重新生成总耗时不到两小时如果手工改代码至少需要一天。2.4 全栈场景下的智能体分工设计全栈开发涉及前端、后端、数据库、部署等多个层面单个智能体很难同时精通所有领域。我的做法是按技术栈拆分智能体每个智能体有自己的专长和工具集。智能体角色负责范围核心工具输出物需求分析智能体解析规格文件拆解任务文件读取、任务队列任务列表、依赖图前端智能体页面组件、状态管理、样式代码生成、组件库查询前端代码、样式文件后端智能体API 接口、业务逻辑、数据校验代码生成、ORM 操作后端代码、接口文档数据库智能体表结构设计、迁移脚本SQL 生成、迁移工具迁移文件、种子数据测试智能体单元测试、集成测试测试框架、断言库测试代码、覆盖率报告审查智能体代码规范、安全漏洞、性能静态分析、依赖检查审查报告、修复建议这套分工不是固定的项目初期我可能只启用需求分析和后端智能体等核心逻辑稳定后再加入前端和测试。关键是每个智能体的输出都要能被下一个环节直接消费不需要人工转换格式。3. 核心细节解析与实操要点从规格到可运行代码的完整链路3.1 规格文件怎么写才能让智能体“看懂”规格文件是整个流程的起点写得好不好直接决定后续生成质量。我踩过的最大坑是一开始用写 PRD 的方式写规格结果智能体理解偏差很大。后来我总结了一套“智能体友好”的规格写法核心原则是结构化、无歧义、可验证。一份合格的规格文件至少包含以下字段module: user_authentication version: 1.0 description: 用户认证模块支持邮箱密码登录和 JWT 令牌刷新 inputs: - name: email type: string format: email required: true - name: password type: string min_length: 8 required: true outputs: - name: access_token type: string expires_in: 3600 - name: refresh_token type: string expires_in: 604800 constraints: - 密码必须使用 bcrypt 加密存储 - 登录失败超过 5 次锁定账户 15 分钟 - 所有接口必须返回统一错误码格式 acceptance: - 正确凭证返回 200 和令牌 - 错误凭证返回 401 和错误信息 - 锁定期间返回 423 和剩余时间这份规格里每个字段都有明确的类型和约束智能体不需要“猜”你的意图。我实测下来用这种格式写的规格后端智能体首次生成代码的可用率能达到 80% 以上剩下的 20% 主要是业务逻辑的边界情况需要补充说明。注意规格文件不要写实现细节比如“用 Redis 存 session”这种话不要写进去。实现方式应该由智能体根据项目现有技术栈决定你只需要定义“做什么”和“做到什么程度”。3.2 智能体框架选型为什么我最终选了自研方案市面上能用的智能体框架不少有平台化的也有代码库形式的。我前后试过三种方案最后选择了基于开源框架做二次开发。这里把选型对比列出来供参考。方案类型代表产品优势劣势适用场景平台化智能体扣子、Dify 等上手快可视化编排定制能力弱数据在第三方快速验证想法代码库框架Agno、DeerFlow 等灵活可深度定制需要自己搭工程化有技术团队的项目自研方案基于开源框架二次开发完全可控贴合项目初期投入大长期迭代的核心项目我最终选择自研核心原因是全栈开发涉及大量项目特有的约定比如我们的 API 返回格式、错误码体系、数据库命名规范这些用平台化方案很难精确控制。自研方案虽然前期花了两周搭架子但后续每个项目的接入成本几乎为零。具体做法是用一个轻量级智能体框架做底座把项目配置、编码规范、工具函数封装成智能体可调用的“技能包”。每个新项目只需要写一份项目配置文件智能体就能自动适配。3.3 上下文管理让智能体“记住”项目约定智能体最大的挑战是上下文窗口有限不可能每次生成代码都把整个项目读一遍。我的解决方案是分层上下文管理。第一层是全局上下文包含项目技术栈、目录结构、编码规范、常用工具函数索引。这部分内容相对稳定每次会话开始时加载一次。第二层是模块上下文包含当前正在开发的模块相关文件比如数据模型、接口定义、已有实现。这部分在切换模块时更新。第三层是任务上下文包含当前具体任务的规格文件和依赖关系每次任务开始时加载。实测下来这种分层方式能把上下文 token 消耗降低 60% 以上同时保证智能体不会“忘记”关键约定。我试过在一个有 200 多个文件的项目里用这种方式开发新模块智能体生成的代码和项目原有风格基本一致不需要大量手工调整。3.4 代码审查智能体的配置要点代码审查智能体是保证质量的关键环节。我的配置里审查智能体需要检查以下几类问题规范类命名是否符合项目约定、注释是否完整、文件组织是否合理安全类是否有 SQL 注入风险、敏感信息是否硬编码、权限校验是否缺失性能类是否有 N1 查询、是否有不必要的循环嵌套、缓存使用是否合理兼容类是否使用了项目未引入的依赖、是否破坏了已有接口的兼容性审查智能体的输出不是简单的“通过/不通过”而是一份带优先级的问题列表。高优先级问题必须修复才能进入下一环节低优先级问题记录到技术债务清单。我试过让审查智能体连续审查同一个模块三次第一次发现 12 个问题修复后第二次发现 3 个第三次通过。这个迭代过程比人工审查快很多而且不会因为疲劳而漏掉问题。4. 实操过程与核心环节实现一个完整模块的 Vibe Coding 实录4.1 项目背景与任务定义为了让你能复现我用一个具体的例子来演示。假设我们要开发一个“文章评论模块”需求如下用户可以在一篇文章下发表评论评论支持嵌套回复最多两层评论需要审核后才能公开显示管理员可以删除任意评论。这个需求不算复杂但涉及前端展示、后端接口、数据库设计、权限控制是一个典型的全栈场景。我把它写成规格文件然后启动智能体流水线。4.2 第一步需求分析智能体拆解任务需求分析智能体读取规格文件后输出了以下任务列表设计评论表结构包含文章 ID、用户 ID、父评论 ID、内容、状态、创建时间实现发表评论接口校验文章存在、用户已登录、内容长度合规实现评论列表接口支持分页只返回已审核评论嵌套结构组装实现评论审核接口管理员权限校验实现评论删除接口管理员权限校验级联删除子评论前端评论组件包含输入框、列表展示、回复功能前端管理后台评论审核页面每个任务都标注了依赖关系比如任务 2 依赖任务 1任务 6 依赖任务 3。这个依赖图是后续并行执行的基础。4.3 第二步数据库智能体生成迁移脚本数据库智能体根据任务 1 的规格生成了以下迁移脚本以 PostgreSQL 为例CREATE TABLE comments ( id BIGSERIAL PRIMARY KEY, article_id BIGINT NOT NULL REFERENCES articles(id) ON DELETE CASCADE, user_id BIGINT NOT NULL REFERENCES users(id) ON DELETE CASCADE, parent_id BIGINT REFERENCES comments(id) ON DELETE CASCADE, content TEXT NOT NULL CHECK (char_length(content) BETWEEN 1 AND 2000), status VARCHAR(20) NOT NULL DEFAULT pending CHECK (status IN (pending, approved, rejected)), created_at TIMESTAMP WITH TIME ZONE DEFAULT NOW(), updated_at TIMESTAMP WITH TIME ZONE DEFAULT NOW() ); CREATE INDEX idx_comments_article_status ON comments(article_id, status); CREATE INDEX idx_comments_parent ON comments(parent_id); CREATE INDEX idx_comments_user ON comments(user_id);这里有几个细节值得注意。parent_id自引用实现了嵌套回复ON DELETE CASCADE保证删除父评论时子评论自动删除。status字段用 CHECK 约束限制取值范围避免脏数据。索引设计上article_id status组合索引覆盖了最常用的查询场景parent_id索引加速子评论查询。提示迁移脚本生成后我习惯让数据库智能体同时生成一份回滚脚本。虽然大部分时候用不上但一旦迁移出问题回滚脚本能救命。4.4 第三步后端智能体实现接口逻辑后端智能体根据任务 2、3、4、5 的规格生成了以下核心代码以 Python FastAPI 为例from fastapi import APIRouter, Depends, HTTPException, Query from sqlalchemy.orm import Session from typing import List, Optional router APIRouter(prefix/api/comments, tags[comments]) router.post(/, response_modelCommentResponse) async def create_comment( comment: CommentCreate, db: Session Depends(get_db), current_user: User Depends(get_current_user) ): article db.query(Article).filter(Article.id comment.article_id).first() if not article: raise HTTPException(status_code404, detail文章不存在) if comment.parent_id: parent db.query(Comment).filter(Comment.id comment.parent_id).first() if not parent: raise HTTPException(status_code404, detail父评论不存在) if parent.parent_id: raise HTTPException(status_code400, detail最多支持两层嵌套) new_comment Comment( article_idcomment.article_id, user_idcurrent_user.id, parent_idcomment.parent_id, contentcomment.content, statuspending ) db.add(new_comment) db.commit() db.refresh(new_comment) return new_comment这段代码里智能体自动处理了文章存在性校验、父评论存在性校验、嵌套层级限制。我检查了一遍逻辑完整错误码也符合项目规范。唯一需要调整的是错误信息文案我改成了项目统一的错误码格式。评论列表接口的嵌套组装逻辑稍微复杂一些智能体用了递归查询加内存组装的方式router.get(/article/{article_id}, response_modelList[CommentTree]) async def get_article_comments( article_id: int, page: int Query(1, ge1), page_size: int Query(20, ge1, le100), db: Session Depends(get_db) ): offset (page - 1) * page_size root_comments db.query(Comment).filter( Comment.article_id article_id, Comment.parent_id.is_(None), Comment.status approved ).order_by(Comment.created_at.desc()).offset(offset).limit(page_size).all() result [] for root in root_comments: children db.query(Comment).filter( Comment.parent_id root.id, Comment.status approved ).order_by(Comment.created_at.asc()).all() result.append(CommentTree( **root.__dict__, children[CommentTree(**child.__dict__) for child in children] )) return result这个实现有个潜在问题如果一页有 20 条根评论每条平均 5 条子评论就会产生 1 次根查询加 20 次子查询总共 21 次数据库查询。审查智能体在后续环节指出了这个问题建议改成一次性查出所有相关评论再在内存中组装。我采纳了这个建议优化后查询次数降到 2 次。4.5 第四步前端智能体生成组件代码前端智能体根据任务 6 的规格生成了 React 组件代码。核心逻辑包括评论输入框、评论列表渲染、回复功能。这里截取评论列表组件的关键部分const CommentList ({ articleId }) { const [comments, setComments] useState([]); const [loading, setLoading] useState(false); const [page, setPage] useState(1); useEffect(() { fetchComments(); }, [articleId, page]); const fetchComments async () { setLoading(true); try { const res await api.get(/api/comments/article/${articleId}, { params: { page, page_size: 20 } }); setComments(res.data); } catch (err) { message.error(评论加载失败); } finally { setLoading(false); } }; const handleReply async (parentId, content) { await api.post(/api/comments/, { article_id: articleId, parent_id: parentId, content }); message.success(评论已提交等待审核); fetchComments(); }; return ( div classNamecomment-list {comments.map(comment ( CommentItem key{comment.id} comment{comment} onReply{handleReply} / ))} Pagination current{page} onChange{setPage} / /div ); };前端智能体自动处理了加载状态、错误提示、分页逻辑。我检查后发现一个细节回复成功后没有清空输入框手动补了一行代码。整体来说前端代码的可用率在 75% 左右主要调整集中在交互细节和样式适配。4.6 第五步测试智能体生成测试用例测试智能体根据规格文件中的验收标准生成了以下测试用例def test_create_comment_success(client, auth_headers, article): response client.post(/api/comments/, json{ article_id: article.id, content: 这是一条测试评论 }, headersauth_headers) assert response.status_code 200 assert response.json()[status] pending def test_create_comment_article_not_found(client, auth_headers): response client.post(/api/comments/, json{ article_id: 99999, content: 测试 }, headersauth_headers) assert response.status_code 404 def test_create_nested_comment_exceeds_depth(client, auth_headers, article, comment): response client.post(/api/comments/, json{ article_id: article.id, parent_id: comment.id, content: 嵌套回复 }, headersauth_headers) assert response.status_code 400测试智能体覆盖了正常流程、文章不存在、嵌套超限等场景。我补充了几个边界用例比如内容为空、内容超长、未登录用户发表评论。测试跑下来覆盖率报告显示核心逻辑覆盖率 92%基本达标。4.7 第六步审查智能体把关质量审查智能体对整个模块做了三轮检查。第一轮发现的问题包括评论列表接口的 N1 查询问题、删除接口缺少级联删除确认、前端组件缺少防抖处理。第二轮检查确认了修复情况又发现了一个新的问题审核接口没有记录审核日志。第三轮检查通过输出了最终审查报告。这个过程中审查智能体不仅指出问题还给出了修复建议和参考代码。我只需要确认建议是否合理然后让对应的智能体执行修复。整个审查环节耗时约 15 分钟如果人工做同样深度的审查至少需要半天。5. 常见问题与排查技巧实录踩过的坑和填坑方法5.1 智能体生成代码“跑偏”了怎么办这是最常见的问题。智能体生成的代码逻辑和你的预期不一致或者用了你不想要的技术方案。我的排查思路是分三步走。第一步检查规格文件是否足够明确。大部分“跑偏”都是因为规格里有歧义。比如你写“评论需要审核”智能体可能理解为“发表后自动进入审核队列”也可能理解为“发表后直接显示但标记为待审核”。改成“评论发表后状态为 pending只有 status 为 approved 的评论才会在列表接口返回”歧义就消除了。第二步检查上下文是否加载了正确的项目约定。如果智能体用了项目里不存在的工具函数说明全局上下文没有正确加载。我遇到过智能体生成代码时引用了utils.auth.verify_token但项目里实际是utils.auth.check_token原因是全局上下文里的工具函数索引没有更新。第三步检查任务拆解是否合理。如果一个任务太大智能体容易在细节上失控。比如“实现评论模块”这个任务就太大了拆成“设计表结构”“实现发表接口”“实现列表接口”等小任务后每个任务的生成质量都会提升。5.2 多个智能体输出冲突怎么处理当多个智能体并行工作时输出冲突是难免的。比如前端智能体定义的接口字段名和后端智能体不一致或者数据库智能体设计的表结构和后端智能体的 ORM 模型对不上。我的处理方式是引入“接口契约”环节。在任务拆解完成后先让需求分析智能体生成一份接口契约文件定义所有跨模块的接口字段、数据类型、错误码。前端、后端、数据库智能体都以这份契约为准生成代码。契约文件在项目初期就固定下来后续变更需要走版本管理。实测下来引入接口契约后跨模块冲突减少了 80% 以上。剩下的冲突主要是业务逻辑层面的比如前端认为某个操作应该即时生效后端认为需要异步处理这类冲突需要人工决策。5.3 智能体“忘记”项目约定的几种情况和解法智能体“忘记”约定通常有三种表现命名风格不一致、错误处理方式不统一、依赖引入混乱。命名风格不一致最常见。项目里用 snake_case 命名数据库字段智能体生成了 camelCase。解法是在全局上下文里放一份命名规范文件并且明确写“所有数据库字段必须使用 snake_case”。我试过在规范文件里加正反例效果比只写规则好很多。错误处理方式不统一也很常见。项目里用统一的AppError异常类智能体直接抛了HTTPException。解法是在全局上下文里放一份错误处理示例代码让智能体模仿。依赖引入混乱是指智能体用了项目里没有的库。解法是在全局上下文里放一份requirements.txt或package.json的摘要明确列出可用依赖。如果智能体确实需要新依赖让它先输出依赖变更说明人工确认后再安装。5.4 性能问题的早期发现和修复智能体生成的代码功能正确但性能可能有问题。我总结了几类高频性能问题和对策。问题类型典型表现排查方法修复方案N1 查询列表接口响应慢数据库查询次数多开启 SQL 日志统计查询次数改用 join 或批量查询内存泄漏长时间运行后内存持续增长内存分析工具定期快照对比检查事件监听、缓存未清理重复计算CPU 占用高相同计算反复执行性能分析工具火焰图加缓存或提取公共计算大文件读写IO 等待时间长监控文件操作耗时流式处理或分片读写审查智能体可以配置性能检查规则比如“单次请求数据库查询不超过 5 次”“循环内不允许有数据库操作”。这些规则能在代码生成阶段就拦截大部分性能问题。5.5 智能体行为审计与安全边界智能体驱动开发有一个容易被忽视的风险智能体可能执行了你不期望的操作。比如删除了不该删的文件、修改了生产环境配置、调用了外部服务。我的做法是给智能体设置明确的安全边界。文件操作限制在项目目录内禁止访问系统目录。命令执行限制在白名单内比如只允许运行测试、构建、迁移命令禁止运行删除、部署命令。外部 API 调用需要人工确认智能体只能生成调用代码不能直接执行。同时我会定期审计智能体的操作日志检查是否有异常行为。审计内容包括文件修改记录、命令执行记录、外部调用记录。这套机制运行了三个月没有出现严重的安全问题但确实拦截了几次智能体试图修改配置文件的操作。5.6 常见问题速查表问题现象可能原因快速排查解决方案生成代码无法运行依赖缺失或版本不匹配检查 import 和 requirements补充依赖或调整版本接口字段对不上前后端契约不一致对比接口契约文件统一以契约为准测试用例失败规格理解偏差检查规格文件描述细化规格或调整测试审查智能体误报规则过于严格查看审查报告详情调整规则阈值智能体响应慢上下文过大检查 token 消耗优化上下文分层生成代码风格不一致全局上下文未加载检查配置文件重新加载项目约定6. 我个人的实操体会与后续扩展方向这套 Vibe Coding 全栈开发流程我前后在四个项目里完整跑过最大的感受是它把开发者的角色从“实现者”变成了“定义者和审核者”。你不再需要记住每个框架的 API但你需要更清楚地知道“我要什么”和“什么是对的”。这其实对开发者的架构能力和业务理解能力提出了更高要求而不是降低了门槛。有一个细节我印象很深。在一个项目里智能体生成的代码功能完全正确但审查智能体指出“这个实现方式虽然能跑但和项目其他模块的风格不一致后续维护成本高”。我当时犹豫了一下还是让智能体重构了。后来那个模块经历了三次需求变更因为风格统一每次修改都很顺畅。这件事让我意识到Vibe Coding 的价值不在于“快”而在于“一致”——它能让整个项目的代码风格、错误处理、测试覆盖保持在一个稳定的水平线上不会因为不同开发者的习惯而参差不齐。后续我打算在这几个方向继续折腾一是把智能体接入 CI/CD 流水线让代码审查和测试生成成为提交时的自动环节二是积累更多项目类型的规格模板比如管理后台、API 服务、数据管道让新项目启动时能直接复用三是研究多智能体协同的冲突消解机制目前还是靠人工决策希望能进一步自动化。如果你也在做类似的事情欢迎交流踩坑经验。
RELATED READING

延伸阅读

更多一线实战笔记与深度复盘,助您持续精进