# 天猫新品团队AI编码实战指南（下）

**来源：** [微信公众号 - 大淘宝技术](https://mp.weixin.qq.com/s/iRkxznDYhE-kXjbIHlrnNA)
**作者：** 天猫新品营销技术
**日期：** 2026年5月8日 16:07
**标签：** #AI编码 #天猫 #全栈化 #知识库 #实战指南

---

## 背景

团队开始了后端向前，前端向后的全栈化转型运动。后端承担小二工作台与研发工具开发（需求驱动型），前端承担 C 端 solution 编写。

**核心思想：** 作为业务团队，重点应该是沉淀自己团队的工作流与 AI 资产——通过**最大化复用**来提高整体效能（代码、知识、工作流、工具的复用）。

### 场景分类

| 严苛程度 | 典型场景 | 错误容忍 | 交互问题容忍 | 代码要求 | 视觉还原要求 |
|----------|---------|---------|-------------|---------|-------------|
| 最为严苛 | C 端频道 | 0 容忍 | 明显则 0 容忍 | 高 | 高 |
| 较为严苛 | B 端商家平台 | 0 容忍 | 特别明显则 0 容忍 | 中 | 中 |
| **交付分割线** | | | | | |
| 普通严苛 | 小二端工作台 | 0 容忍 | 影响主链路则 0 容忍 | 低 | 低 |
| 低严苛 | 研发自用工具 | 一定程度容忍 | 无 hack 绕过则 0 容忍 | 无 | 无 |
| 不严苛 | 研发 DEMO | 能意会则容忍 | 怎么都能容忍 | 无 | 无 |

---

## 小二端 - AI 主导的对话生码

特点：无视觉还原要求，实现形式自由，页面独立性强，适合 AI 编码完成全部需求。

### 初期 - 统一生成方案
- 提供标准化的代码规范与视觉规范文档
- 提供高度封装的代码模版（一行代码唤起页面组件）

### 中期 - 辅助补齐前端经验短板
- **需求描述不准确**：搭建「AI案例实践中心」，标准化 prompt 模板；提供 MCP 速查工具「天猫新品业务编码助手」
- **垂类场景无经验**：将 AI 生码省下的时间用于生码沉淀，详细记录实现过程与踩坑心得

### 后期 - 更简单、无感、一致的方案
- 开发轻量级团队知识库，以类 Skill 形式封装开发规范与代码模板
- 知识库用 git 仓库管理，npm 包作为资源承载与版本管理工具

---

## C 端 - 交付质量要求的 AI 提效

C 端场景复用机制复用分为五个级别：
1. **代码复用**：对组件、布局、逻辑进行封装（RCG——布局/组件/脚手架粒度递进）
2. **知识复用**：团队知识库 + 逐层加载
3. **工作流复用**：固定 AI 工作流 + 兜底方案
4. **工具复用**：通过 MCP 协议 + 内部工具获取业务数据
5. **人机分工**：固定重复工作交 AI，关键环节人把控

### 视图分离方案

**核心思想：** 把一份 PRD 分成"给 AI 的结构化描述"和"给人看的说明文档"，各自优化。

- 在 C 端，过复杂的 prompt 和过长的上下文都会带来性能问题
- 提出了结构化的 prompt 写法，包含场景分析、关键数据、交互与动效说明

### 知识库建设

对标 OpenAI 的 `prompt.md` + `--preamble` 的标准化管理：
1. 定义优先级规则
2. 使用 script 进行文件注入（含自动 chunk、优先命中机制）
3. 统一文件结构和索引

---

## 实用技巧集锦

- **UI 重构**：利用 prompt 对图片转结构化描述
- **复杂 Prompt 构建**：结构化多段式
- **多方案选优**：让 AI 给出多个方案并对比
- **文档生成**：代码完成后自动生成说明文档
- **严厉语气 + 合理质疑**：实验表明严厉语气能提升准确率