Claude 的底层能力正在重新定义开发流程。本文将深入解析如何利用 Projects、MCP、Skills 和 Subagents 四大核心组件，构建一个名为 FMS-Dev-Agent 的全栈开发智能体系统。从数据库设计到前后端代码生成，这套 AI 驱动的开发团队能够将需求文档直接转化为可运行代码，实现真正的"文档即代码"革命。
本文档将视角从“使用者”切换为“开发者/架构师”。我们将展示如何利用 Claude 的底层能力（Projects, MCP, Skills, Subagents），亲手构建一个名为 FMS-Dev-Agent 的超级智能体。这个智能体将作为您的核心开发团队，读取《1.1 订单管理》需求文档，并将其转化为实际的代码（SQL、后端 API、前端页面）。
FMS-Dev-Agent 不是一个简单的聊天机器人，而是您亲手打造的一套多智能体协作系统。在这个系统中，各个组件构成了它的“器官”：
假设您已经构建好了这个智能体，现在我们要指挥它干活。
任务目标：基于 1.1 订单管理.md，开发出真实可运行的订单录入功能。
首先，我们需要让 FMS-Dev-Agent 的大脑装入业务知识。
构建动作：
1）在智能体配置中创建一个 Project：FMS_Builder_Context。
2）上传核心记忆：
效果：当您对 FMS-Dev-Agent 说“写一个订单结构体”时，它会自动从大脑中检索 1.1 订单管理.md 中的字段列表（如 起运地、HS编码），而不需要您手动列出字段。
为了让智能体能在您的 IDE 中写代码，需要给它安装 MCP 驱动。
配置动作：
为了防止智能体生成的代码风格乱七八糟，我们需要给它植入 Skills。
Skill 1： Generate_SQL_From_MD
—
name: Generate_SQL_From_MD
description: 当用户提供数据实体的 Markdown 表格或描述时，将其转换为 PostgreSQL DDL。
—
# SQL Generation Protocol
当生成 SQL 时，请严格遵守以下规范：
1. **Naming Convention**: 所有表名和字段名必须使用 `snake_
case`。
2. **Primary Key**: 主键必须定义为 `id UUID PRIMARY KEY DEFAULT gen_random_uuid()`。
3. **Standard Fields**: 每个表必须包含以下审计字段：
* `created_at TIMESTAMPTZ DEFAULT NOW()`
* `updated_at TIMESTAMPTZ DEFAULT NOW()`
* `is_deleted BOOLEAN DEFAULT FALSE`
4. **Comments**: 必须为每个字段添加 `COMMENT ON COLUMN` 以解释其业务含义。
Skill 2： Vue3_Component_Gen
—
name: Vue3_Component_Gen
description: 当基于 UI 原型生成前端代码时，强制执行 Vue 3 + Element Plus 规范。
—
# Vue 3 Component Generation Protocol
当生成 Vue 组件时，请严格遵守以下规范：
1. **Tech Stack**: 使用 Vue 3 (Composition API) + TypeScript + Element Plus。
2. **Syntax**: 必须使用 `<script setup lang=”ts”>` 语法糖。
3. **Structure**: 代码结构顺序必须如下：
1. Imports
2. Interfaces/Types
3. Reactive State (ref/reactive)
4. Computed/Watch
5. Methods/Handlers
4. **Best Practices**:
* 使用 `el-form` 进行数据录入。
* 将 API 调用逻辑抽取到 `@/api/modules/…`。
* 禁止硬编码文本，应保留在 Template 或变量中。
我们将开发过程拆解给 FMS-Dev-Agent 的三个分身。
1. 分身 A：数据库架构师 (DB Architect Agent)
任务：分析业务实体，设计数据库表结构。
Prompt：
“作为数据库专家，请阅读大脑 Project 中的 1.1 订单管理.md，重点分析‘新建订单页面’中的字段。
请严格遵守 Generate_SQL_From_MD Skill 中的命名规范（如 UUID 主键、通用字段）。
请设计 t_orders 和 t_order_items 表结构。
使用 FileSystem MCP 将 SQL 保存到 db/migrations/001_create_orders.sql，并使用 Postgres MCP 在本地库执行。”
执行结果：
产出物：生成的 SQL 文件并成功建表。
2. 分身 B：后端开发工程师 (Backend Dev Agent)
任务：生成 API 接口和业务逻辑。
Prompt：
“作为 Golang 后端专家，基于刚才设计的 t_orders 表，请按照大脑 Project 中的‘Clean Architecture’规范，生成订单模块的代码。
需包含：
– internal/domain/order.go (实体定义)
– internal/usecase/order_usecase.go (包含‘智能拆解’的预留逻辑接口)
– internal/delivery/http/order_handler.go (Gin 路由)
请使用 FileSystem MCP 写入文件。”
执行结果：
产出物：完整的后端 CRUD 代码。
3. 分身 C：前端开发工程师 (Frontend Dev Agent)
任务：还原 UI 原型。
Prompt：
“作为 Vue 前端专家，请查看大脑 Project 中 1.1 订单管理.md 的‘新建订单页面（完整版）’原型图。
这是一个复杂的表单，包含‘综合运输’和‘单项服务’的动态切换逻辑。
请应用 Vue3_Component_Gen Skill 中的组件拆分和 <script setup> 规范。
请编写 OrderCreate.vue 组件，使用 Element Plus。
难点处理：当选择‘综合运输’时，显示起运港/目的港；选择‘单项服务’时，显示服务类型复选框。”
执行结果：
产出物：高度还原的 Vue 页面代码。
作为架构师，您只需要发出以下元指令，让 FMS-Dev-Agent 调度其分身完成工作：
User Input:
“呼叫 FMS-Dev-Agent，我们需要开发订单模块的‘创建订单’功能。
1）请 DB Agent 参考 1.1 文档设计表结构并应用。
2）确认数据库就绪后，请 Backend Agent 生成对应的 Go API 代码。
3）最后请 Frontend Agent 生成 Vue 表单页面。
4）请一步步执行，每一步完成后向我确认。”
FMS-Dev-Agent 执行过程:
1）思考: 检索大脑 Project 上下文 -> 识别 1.1 文档。
2）调度 DB Agent:
3）反馈: “表结构已创建，包含 order_id, service_type 等字段。是否继续后端开发？”
4）User: “继续。”
5）调度 Backend Agent:
6）反馈: “后端 API 已生成，路径 /api/v1/orders。是否继续前端开发？”
7）User: “继续。”
8）调度 Frontend Agent:
加载 Skill: Vue3_Component_Gen (获取 Vue3+ElementPlus 规范)。
执行: 读取文档中的 UI 原型 -> 生成 Vue 组件 -> 调用 MCP 写入文件。
通过这种方式，我们成功构建了 FMS-Dev-Agent。
本文由 @天涯轩 原创发布于人人都是产品经理。未经作者许可，禁止转载
题图来自Unsplash，基于CC0协议
此内容由惯性聚合(RSS阅读器)自动聚合整理，仅供阅读参考。 原文来自 — 版权归原作者所有。