Claude Code实战：用AI从零构建宠物生命周期管理App

1. 项目概述：这不是一个“AI写代码”的演示，而是一次真实产品级交付的完整复盘

“Claude Code从零搭建新项目全流程AI实现-宠物生命周期管理App”——这个标题里藏着三个关键信号：Claude Code是当前少有的、真正能理解业务语义并生成可运行代码的AI编程助手；从零搭建意味着不依赖任何现成脚本或模板，所有架构决策、模块划分、接口设计均由AI协同完成；而宠物生命周期管理App则是一个典型的垂直领域轻量级SaaS型应用，它既不能简单套用TodoList模板，又无需微服务集群的复杂度，恰好卡在“AI能真正帮上忙”的黄金区间。我最近用这套方法，在3天内完成了一个可演示、可部署、带基础数据看板的MVP版本，核心功能包括：宠物档案创建（含品种图谱识别建议）、疫苗/驱虫/体检时间轴自动提醒、多宠家庭关系图谱、绝育/生病/离世等关键事件标记与情感化纪念页生成。整个过程没有手写一行前端组件或后端路由，所有代码由Claude Code基于自然语言需求描述生成，再由我做语义校验、边界补全和安全加固。它适合两类人深度参考：一是想验证AI是否真能参与实际产品开发的中小团队技术负责人；二是正卡在“想法很多但启动成本太高”阶段的独立开发者。你不需要会React或Django，但需要具备基本的工程判断力——比如知道什么时候该让AI生成SQL Schema，什么时候必须手动重写事务逻辑。下面我会把这3天的真实操作路径、每一步的决策依据、Claude的提示词结构、以及那些官方文档绝不会写的“临界点经验”，全部摊开来讲。

2. 全流程设计思路拆解：为什么选Claude Code而不是Copilot或Cursor？

2.1 核心逻辑：用AI替代“需求翻译器”，而非“代码补全器”

传统开发流程中，产品经理写PRD → 技术负责人画架构图 → 开发者写代码，中间存在三重信息衰减。而Claude Code的独特价值在于它能直接消化业务语言，并输出可执行的工程产物。举个具体例子：当我输入“用户添加一只金毛幼犬时，系统应自动推荐该品种常见遗传病筛查项，并在6周龄、8周龄、12周龄分别推送疫苗接种提醒”，Claude Code不仅生成了数据库表结构（pet_breed_diseases、vaccination_schedule），还同步输出了后端API路由（POST /api/pets/{id}/vaccination-schedule）和前端提醒卡片组件的Vue代码。这种跨层联动能力，是Copilot这类纯补全工具无法实现的——Copilot需要你先定义好API接口，再让它补全参数；而Claude Code能从“6周龄推送”这个业务规则，反向推导出需要存储的字段（next_vaccination_due、vaccination_type）、触发条件（pet.age_in_weeks >= 6）和通知渠道（in-app banner + SMS）。所以我们的全流程设计起点不是“写代码”，而是构建一套能让Claude精准理解业务意图的提示词框架。这个框架包含四个刚性要素：领域上下文（宠物医疗知识库摘要）、约束条件（必须使用SQLite，禁止外部API调用）、输出格式（明确要求JSON Schema+TypeScript接口定义+Vue单文件组件）、错误处理规范（所有API必须返回400/404/500状态码及中文错误消息）。没有这四要素，Claude会生成大量“看起来很美但无法落地”的代码。

2.2 架构选型：为什么放弃Node.js+Express转向T3 Stack？

最初我尝试让Claude基于“用Node.js写REST API”生成后端，结果得到的代码存在两个致命问题：一是路由定义分散在多个文件，Claude无法保证中间件加载顺序；二是数据库连接池配置与错误日志格式不统一，导致后续调试时出现“同一错误在不同路由返回不同格式”的混乱。转而采用T3 Stack（t3-env + tRPC + Next.js）后，Claude的输出质量显著提升。原因在于T3的约束性极强：t3-env强制环境变量类型校验，tRPC将API定义、服务端实现、客户端调用封装在同一ts文件中，Next.js的App Router天然支持服务端组件与数据获取一体化。当我说“为宠物健康记录添加一个按月份统计的图表API”，Claude直接生成：

// app/api/health-stats/route.ts export async function GET(req: Request) { const { searchParams } = new URL(req.url); const month = searchParams.get('month'); // 格式：2024-06 const stats = await db.healthRecord.groupBy({ by: ['type'], where: { createdAt: { gte: new Date(`${month}-01`), lt: addMonths(new Date(`${month}-01`), 1) } }); return Response.json({ data: stats }); }

这段代码里包含了完整的日期范围计算（addMonths需引入date-fns）、Prisma查询语法、HTTP响应封装——而这些细节在Node.js原始方案中需要我手动补全至少7处。T3 Stack的本质是给Claude提供了一套“有边界的乐高积木”，它不再需要猜测“应该用什么ORM”或“如何处理CORS”，所有选择都被框架预设。这印证了一个关键经验：AI编程的效率不取决于模型参数量，而取决于你为它划定的工程边界是否清晰。我们最终的技术栈锁定为：前端Next.js 14（App Router）、后端tRPC+Prisma（SQLite本地开发）、UI库Shadcn（组件可定制性强，Claude能准确生成其Props类型）、部署Vercel（免费且自动绑定域名）。这个组合在Claude的语料库中高频出现，生成稳定性远超自定义技术栈。

2.3 领域知识注入：如何让AI理解“猫传腹”不是感冒，“绝育”不是普通手术？

宠物医疗领域存在大量专业术语和隐含逻辑，如果直接让Claude生成“疾病管理模块”，它大概率会输出一个通用疾病表（disease_name, description, treatment），但这对实际场景毫无价值。真正的业务需求是：“当用户标记宠物患有‘猫传染性腹膜炎（FIP）’时，系统应禁用所有非FIP专用药品的处方录入，并在健康日志中高亮显示‘需定期监测血清白球比’”。要达成这种深度语义理解，必须进行结构化知识注入。我的做法是：在首次对话前，向Claude提供一份精简版《小动物临床诊疗指南》摘要，仅包含3类信息：① 疾病-症状映射表（FIP→发热、腹水、眼葡萄膜炎）；② 治疗禁忌矩阵（FIP患者禁用糖皮质激素）；③ 监测指标阈值（白球比<0.8需预警）。这份摘要只有217个单词，但让Claude生成的疾病管理模块代码中，自动包含了：

• 前端表单的动态禁用逻辑（根据所选疾病过滤药品下拉框）
• 后端API的业务规则校验（创建处方时检查drug_id是否在fip_restricted_drugs列表中）
• 数据看板的预警指标计算（实时计算白球比并标红异常值） 这种知识注入不是“喂资料”，而是构建一个可被代码逻辑引用的业务规则字典。它解决了AI在垂直领域最大的短板：缺乏行业上下文。后续所有模块开发，我都沿用此模式——先用100字以内定义核心业务规则，再让Claude生成对应代码。例如“绝育管理”模块，我输入：“绝育手术后72小时内，禁止记录剧烈运动类活动（如‘奔跑’‘跳跃’），系统需在活动录入页自动隐藏相关选项”，Claude随即生成了带条件渲染的ActivityForm组件和对应的后端校验中间件。

3. 核心模块实操解析：从提示词到可运行代码的完整链路

3.1 宠物档案模块：如何让AI生成带图谱识别的智能表单？

宠物档案是整个App的数据基石，但传统方案需要用户手动填写品种、年龄、性别等字段，错误率极高。我们的目标是：用户上传一张宠物照片，系统自动识别品种并预填基础信息，同时给出该品种的健康风险提示。这里的关键挑战在于——Claude Code本身不具备图像识别能力，必须通过调用外部API实现。但直接让Claude生成“调用百度AI图像识别”的代码会违反安全规范（涉及密钥硬编码、无错误降级）。解决方案是抽象为可插拔的服务接口。我在提示词中明确要求：“创建PetRecognitionService接口，包含detectBreed(image: File)方法，返回{breed: string, confidence: number, healthRisks: string[]}。具体实现暂为空函数，但必须包含完整的TypeScript类型定义和JSDoc注释，说明‘此服务需对接第三方图像识别API，生产环境需配置API_KEY环境变量’”。Claude生成的代码如下：

// lib/services/pet-recognition.ts /** * 宠物品种识别服务 * 生产环境需配置： * - NEXT_PUBLIC_PET_RECOGNITION_API_URL: 图像识别API地址 * - PET_RECOGNITION_API_KEY: 访问密钥（服务端环境变量） */ export interface PetRecognitionResult { breed: string; // 识别出的品种，如"英国短毛猫" confidence: number; // 置信度0-1 healthRisks: string[]; // 该品种常见健康风险，如["肥厚型心肌病","多囊肾病"] } export class PetRecognitionService { private readonly apiUrl: string; private readonly apiKey: string; constructor() { this.apiUrl = process.env.NEXT_PUBLIC_PET_RECOGNITION_API_URL || ''; this.apiKey = process.env.PET_RECOGNITION_API_KEY || ''; } /** * 识别宠物品种及健康风险 * @param image 文件对象，需为JPEG/PNG格式 * @returns 识别结果，失败时返回空数组 */ async detectBreed(image: File): Promise<PetRecognitionResult[]> { if (!this.apiUrl || !this.apiKey) { console.warn('PetRecognitionService未配置，返回模拟数据'); return [{ breed: '中华田园猫', confidence: 0.82, healthRisks: ['牙周病', '肥胖症'] }]; } // 实际调用逻辑留空，由后续集成填充 throw new Error('未实现：需集成第三方图像识别服务'); } }

这段代码的价值在于：它用TypeScript契约明确了服务边界，提供了安全的密钥管理方案（前后端环境变量分离），并内置了降级机制（无配置时返回模拟数据）。后续我只需在Vercel环境变量中填入实际API配置，再替换throw new Error部分为真实的fetch调用即可。更重要的是，Claude基于此接口自动生成了前端表单的联动逻辑：

// app/pets/create/page.tsx 'use client'; import { PetRecognitionService } from '@/lib/services/pet-recognition'; export default function CreatePetPage() { const [breedResult, setBreedResult] = useState<PetRecognitionResult | null>(null); const handleImageUpload = async (e: React.ChangeEvent<HTMLInputElement>) => { const file = e.target.files?.[0]; if (!file) return; const service = new PetRecognitionService(); const results = await service.detectBreed(file); if (results.length > 0) { setBreedResult(results[0]); // 自动填充表单字段 form.setValue('breed', results[0].breed); form.setValue('healthRisks', results[0].healthRisks.join('；')); } }; return ( <div> <input type="file" accept="image/*" onChange={handleImageUpload} /> {breedResult && ( <div className="mt-4 p-4 bg-blue-50 rounded"> <h3>识别结果：{breedResult.breed}（置信度{breedResult.confidence.toFixed(2)}）</h3> <p>健康风险：{breedResult.healthRisks.join('；')}</p> </div> )} </div> ); }

这个案例揭示了一个重要原则：不要让AI解决它不擅长的问题，而是让它帮你设计解决这些问题的架构。图像识别交给专业API，Claude负责把API无缝编织进你的应用逻辑。

3.2 时间轴提醒模块：如何用自然语言生成精准的定时任务逻辑？

疫苗/驱虫/体检提醒是宠物主最刚需的功能，但实现难点在于：不同品种、不同年龄、不同健康状况的宠物，提醒规则千差万别。例如“幼犬首免”需在6-8周龄完成，“成年犬狂犬疫苗”需每年加强，“老年犬年度体检”需每半年一次。如果用传统方式，需要设计复杂的规则引擎。而Claude Code的突破点在于：它能将自然语言规则直接转化为可执行的调度逻辑。我的提示词是：“为宠物健康事件创建智能提醒系统。规则：① 疫苗事件：首免在6周龄触发，加强针在首免后3周触发，年度加强在首免后12个月触发；② 驱虫事件：幼犬每月一次，成年犬每3个月一次；③ 体检事件：幼犬每3个月一次，成年犬每年一次，老年犬（≥7岁）每6个月一次。所有提醒需提前3天推送，并支持用户手动关闭”。Claude生成的核心代码是：

// lib/utils/reminders.ts export interface ReminderRule { type: 'vaccination' | 'deworming' | 'checkup'; ageRange: { minWeeks?: number; maxWeeks?: number; minYears?: number; maxYears?: number }; interval: { weeks?: number; months?: number; years?: number }; offsetDays: number; // 提前提醒天数 } export const REMINDER_RULES: ReminderRule[] = [ // 幼犬首免 { type: 'vaccination', ageRange: { minWeeks: 6, maxWeeks: 8 }, interval: { weeks: 0 }, offsetDays: 3 }, // 加强针（首免后3周） { type: 'vaccination', ageRange: { minWeeks: 9 }, interval: { weeks: 3 }, offsetDays: 3 }, // 年度加强（首免后12个月） { type: 'vaccination', ageRange: { minYears: 1 }, interval: { years: 1 }, offsetDays: 3 }, // 幼犬驱虫（每月） { type: 'deworming', ageRange: { maxYears: 1 }, interval: { months: 1 }, offsetDays: 3 }, // 成年犬驱虫（每3个月） { type: 'deworming', ageRange: { minYears: 1 }, interval: { months: 3 }, offsetDays: 3 }, // 老年犬体检（每6个月） { type: 'checkup', ageRange: { minYears: 7 }, interval: { months: 6 }, offsetDays: 3 }, ]; /** * 根据宠物信息生成待触发提醒列表 * @param pet 宠物对象，包含birthDate、species、breed等字段 * @returns 提醒事件数组，每个事件包含triggerAt（触发时间戳）和message */ export function generateReminders(pet: Pet): ReminderEvent[] { const now = new Date(); const ageInWeeks = Math.floor(differenceInWeeks(now, pet.birthDate)); const ageInYears = differenceInYears(now, pet.birthDate); return REMINDER_RULES .filter(rule => { // 检查年龄范围是否匹配 if (rule.ageRange.minWeeks && ageInWeeks < rule.ageRange.minWeeks) return false; if (rule.ageRange.maxWeeks && ageInWeeks > rule.ageRange.maxWeeks) return false; if (rule.ageRange.minYears && ageInYears < rule.ageRange.minYears) return false; if (rule.ageRange.maxYears && ageInYears > rule.ageRange.maxYears) return false; return true; }) .map(rule => { // 计算下次触发时间 let nextTrigger = new Date(pet.birthDate); if (rule.interval.weeks) { nextTrigger = addWeeks(nextTrigger, rule.interval.weeks); } else if (rule.interval.months) { nextTrigger = addMonths(nextTrigger, rule.interval.months); } else if (rule.interval.years) { nextTrigger = addYears(nextTrigger, rule.interval.years); } // 提前offsetDays触发 const triggerAt = subDays(nextTrigger, rule.offsetDays); return { id: `${pet.id}-${rule.type}-${triggerAt.getTime()}`, type: rule.type, message: getReminderMessage(rule.type, pet), triggerAt, isDismissed: false }; }); }

这段代码的精妙之处在于：它把复杂的业务规则转化为可配置的JSON数组（REMINDER_RULES），所有时间计算都基于date-fns的标准化函数，避免了手动计算日期的bug。更关键的是，Claude自动生成了getReminderMessage()函数，根据不同规则返回本地化提示语：

function getReminderMessage(type: string, pet: Pet): string { switch (type) { case 'vaccination': return `${pet.name}该接种${pet.species === 'dog' ? '狂犬疫苗' : '猫三联'}啦！`; case 'deworming': return `${pet.name}需要按时驱虫哦，预防寄生虫感染~`; case 'checkup': return `${pet.name}的年度体检时间到啦，健康检查很重要！`; } }

这证明Claude不仅能理解规则，还能理解语境——它知道“狗”对应“狂犬疫苗”，“猫”对应“猫三联”，这种细节能极大提升用户体验。实测中，这个模块生成的提醒准确率达到100%，因为所有规则都来自我输入的自然语言，不存在人工编码时的逻辑遗漏。

3.3 多宠家庭关系图谱：用图数据库思维实现轻量级关系管理

多宠家庭中，宠物间存在领养关系（如“同窝出生”“同一主人领养”）、社交关系（如“友好”“敌对”）、照护关系（如“A猫常帮B猫理毛”）。如果用传统关系型数据库，需要设计复杂的关联表（pet_pet_relations），查询效率低下。Claude Code的解决方案是：用嵌套JSON结构模拟图谱关系。我的提示词是：“为多宠家庭设计轻量级关系管理系统。要求：① 每只宠物可标记与其他宠物的关系类型（同窝、领养、友好、敌对）；② 关系需双向存储（若A标记B为友好，则B的视图中也显示A为友好）；③ 支持按关系类型筛选宠物列表；④ 不使用Neo4j等图数据库，仅用SQLite”。Claude生成的Prisma Schema如下：

model Pet { id String @id @default(cuid()) name String // ...其他字段 relations Relation[] @relation("PetRelations") } model Relation { id String @id @default(cuid()) petId String relatedPetId String type String @db.VarChar(20) // "littermate", "adopted-together", "friendly", "hostile" createdAt DateTime @default(now()) pet Pet @relation("PetRelations", fields: [petId], references: [id]) relatedPet Pet @relation("PetRelations", fields: [relatedPetId], references: [id]) @@unique([petId, relatedPetId]) @@index([type]) }

这个设计的巧妙在于：它用两个外键（petId, relatedPetId）和一个type字段，就实现了图谱的基本能力。而Claude生成的查询函数更是直击痛点：

// lib/db/relations.ts /** * 获取某只宠物的所有关系（含双向关系） * @param petId 宠物ID * @returns 包含关系类型和关联宠物信息的数组 */ export async function getPetRelations(petId: string) { // 查询以petId为主动方的关系 const outgoing = await prisma.relation.findMany({ where: { petId }, include: { relatedPet: true } }); // 查询以petId为被动方的关系（即其他宠物标记petId的关系） const incoming = await prisma.relation.findMany({ where: { relatedPetId: petId }, include: { pet: true } }); // 合并并去重 const allRelations = [ ...outgoing.map(r => ({ ...r, targetPet: r.relatedPet })), ...incoming.map(r => ({ ...r, targetPet: r.pet })) ].filter((v, i, a) => a.findIndex(t => t.id === v.id) === i); return allRelations; }

这个函数解决了双向关系查询的典型难题：传统方案需要两次JOIN，而Claude用“主动关系+被动关系”的合并思路，用两次简单查询就完成了。更值得称道的是，它生成的前端关系图谱组件，能用SVG动态绘制节点连线：

// components/RelationGraph.tsx export default function RelationGraph({ relations }: { relations: Awaited<ReturnType<typeof getPetRelations>> }) { const nodes = Array.from(new Set(relations.map(r => r.targetPet.id).concat(relations.map(r => r.petId)))); return ( <div className="relative w-full h-96 bg-gray-50 rounded-lg border"> {/* SVG坐标系，节点位置随机分布 */} <svg className="w-full h-full"> {relations.map((rel, i) => ( <g key={i}> {/* 连线 */} <line x1={Math.random() * 300 + 50} y1={Math.random() * 200 + 50} x2={Math.random() * 300 + 50} y2={Math.random() * 200 + 50} stroke={rel.type === 'friendly' ? '#10b981' : '#ef4444'} strokeWidth="2" /> {/* 节点标签 */} <text x={Math.random() * 300 + 50} y={Math.random() * 200 + 50} fontSize="12">{rel.targetPet.name}</text> </g> ))} </svg> </div> ); }

虽然SVG坐标是随机的，但Claude准确理解了“图谱可视化”的核心诉求——用视觉元素表达关系类型。这说明它已超越代码生成，进入体验设计层面。

4. 工程落地关键环节：从AI输出到生产环境的必经之路

4.1 代码校验三原则：语义正确性、边界完整性、安全合规性

Claude生成的代码质量很高，但绝不能直接上线。我建立了三道校验关卡：

第一关：语义正确性校验
重点检查AI是否误解了业务意图。例如在“绝育事件标记”功能中，Claude生成的代码是：

// 错误示例（Claude初版） if (pet.isNeutered) { pet.neuteringDate = new Date(); pet.neuteringStatus = 'completed'; }

这段代码的问题在于：它假设isNeutered是布尔值，但实际业务中“绝育”有三种状态：planned（计划中）、completed（已完成）、cancelled（已取消）。我立刻让Claude修正为：

// 正确版本 if (formData.neuteringStatus === 'completed') { pet.neuteringDate = formData.neuteringDate; pet.neuteringStatus = 'completed'; } else if (formData.neuteringStatus === 'planned') { pet.neuteringDate = formData.plannedDate; pet.neuteringStatus = 'planned'; }

这个修正过程揭示了一个核心经验：AI擅长实现“已知规则”，但不擅长发现“隐含状态”。必须用业务知识反向验证每一行代码。

第二关：边界完整性校验
检查所有可能的异常分支是否被覆盖。Claude生成的疫苗提醒函数中，缺少对“宠物已去世”状态的判断：

// 初版缺失 export function generateVaccinationReminders(pet: Pet) { if (pet.deathDate) return []; // 必须添加此行！ // ...原有逻辑 }

我补充了这行代码，并让Claude在所有涉及时间计算的函数中，统一增加if (pet.deathDate && pet.deathDate < now) return []的守卫逻辑。这个动作看似简单，却避免了“已故宠物仍收到疫苗提醒”的严重体验事故。

第三关：安全合规性校验
这是最容易被忽视的环节。Claude生成的文件上传代码中，包含：

// 危险示例 const buffer = await file.arrayBuffer(); await fs.writeFile(`/uploads/${file.name}`, Buffer.from(buffer));

这存在路径遍历漏洞（file.name可能为../../../etc/passwd）。我强制要求Claude改用安全方案：

// 安全版本 import { randomUUID } from 'crypto'; import { writeFile } from 'fs/promises'; const safeFilename = `${randomUUID()}.${file.name.split('.').pop()}`; const uploadPath = join(process.cwd(), 'public', 'uploads', safeFilename); await writeFile(uploadPath, Buffer.from(await file.arrayBuffer()));

这个修正过程让我意识到：AI是高效的代码生成器，但永远不是安全专家。必须建立强制性的安全检查清单，例如：所有文件操作必须用随机UUID重命名、所有数据库查询必须用Prisma参数化、所有用户输入必须经过Zod Schema校验。

4.2 本地开发环境搭建：如何让Claude生成的代码在3分钟内跑起来？

很多开发者卡在“AI生成了代码，但不知道怎么运行”。我们的解决方案是：让Claude自己生成环境搭建指南。在项目初始化阶段，我输入：“请为本项目生成完整的本地开发环境搭建步骤，包括：① Node.js版本要求；② 数据库初始化命令；③ 环境变量配置示例；④ 启动开发服务器的命令；⑤ 首次访问的URL和默认账号”。Claude输出的README.md片段如下：

## 本地开发指南 ### 环境要求 - Node.js v18.17.0 或更高版本（推荐使用nvm管理） - SQLite3（系统已预装，无需额外安装） ### 初始化步骤 1. 克隆仓库后，安装依赖： ```bash npm install

2. 创建数据库并应用迁移：

   npx prisma migrate dev --name init

3. 复制环境变量模板：

   cp .env.example .env

4. 启动开发服务器：

   npm run dev

5. 访问http://localhost:3000，使用默认账号登录：
   • 用户名：[e-mail]
   • 密码：PetLife2024!

这个指南的价值在于：它完全基于项目实际技术栈生成，没有一句废话。更关键的是，Claude在生成指南的同时，自动创建了`.env.example`文件： ```env # 数据库配置 DATABASE_URL="file:./dev.db" # 第三方服务（可选） NEXT_PUBLIC_PET_RECOGNITION_API_URL="" PET_RECOGNITION_API_KEY="" # 管理员账号 ADMIN_EMAIL="[e-mail]" ADMIN_PASSWORD="PetLife2024!"

这个文件确保了环境变量的完整性。实测中，新成员按照这份指南，平均用时2分47秒完成环境搭建，比传统文档快3倍。这印证了一个事实：最好的开发文档，是AI基于当前代码库实时生成的。

4.3 Vercel一键部署配置：如何让AI生成零配置部署方案？

Vercel是Next.js项目的首选部署平台，但配置常令人头疼。我让Claude生成部署配置时，特别强调：“生成vercel.json配置文件，要求：① 自动检测Next.js框架；② 设置环境变量（DATABASE_URL需指向Vercel的SQLite文件）；③ 配置自定义域名（petlife-demo.vercel.app）；④ 启用自动HTTPS”。Claude输出的vercel.json如下：

{ "version": 2, "builds": [ { "src": "package.json", "use": "@vercel/next" } ], "routes": [ { "src": "/(.*)", "dest": "/" } ], "github": { "silent": true }, "environments": { "DATABASE_URL": "file:/var/task/dev.db" } }

这个配置的精妙之处在于：它利用Vercel的Serverless特性，将SQLite数据库文件存放在/var/task/临时目录（Vercel函数的读写权限目录），避免了传统方案中需要配置PostgreSQL的复杂度。而Claude生成的部署说明更是直击要害：

提示：Vercel免费版不支持持久化SQLite，因此生产环境请升级至Pro套餐，或改用PlanetScale（已预配置连接字符串）。本配置适用于演示环境，数据库重启后会重置。

这句话体现了Claude对云平台限制的深刻理解——它没有盲目承诺“完全免费”，而是给出了务实的升级路径。我们最终用这个配置，实现了“git push后57秒完成部署”，整个过程无需任何手动操作。

5. 真实踩坑记录与避坑指南：那些AI不会告诉你的临界点

5.1 “过度拟合”陷阱：当Claude开始编造不存在的API

在开发“宠物行为日志”模块时，我输入：“记录宠物每日活动，支持‘进食’‘排泄’‘玩耍’‘睡眠’等分类”。Claude生成的代码中，出现了activityType: 'feeding' | 'defecation' | 'playing' | 'sleeping'，这看起来很合理。但当我尝试添加“呕吐”行为时，Claude自作主张生成了'vomiting'枚举值，并在后端校验中添加了“呕吐需关联胃镜检查报告”的逻辑——而这个需求我从未提过。这是典型的“过度拟合”：AI基于训练数据中的医疗知识，自动补全了它认为“应该存在”的业务规则。我的应对策略是：所有枚举类型必须显式声明完整列表，禁止AI扩展。我立即修正提示词：“活动类型仅限以下4种：feeding, defecation, playing, sleeping。严禁添加任何新类型，所有校验逻辑必须严格基于此列表”。此后Claude再未出现此类问题。这个教训是：AI的创造力是把双刃剑，必须用明确的约束把它锁在业务边界内。

5.2 “上下文丢失”危机：长对话中Claude突然忘记核心约定

Claude的上下文窗口有限，当对话超过20轮后，它会开始遗忘早期约定。最危险的一次发生在“数据导出”功能开发中：我最初约定“所有导出文件必须用CSV格式，禁止Excel”，但到第23轮时，Claude生成了xlsx依赖包和generateExcelReport()函数。我立刻中断对话，新建一个会话，并在首条消息中粘贴所有核心约定（技术栈、安全规范、格式要求）。这个动作让我损失了15分钟，但避免了后续更多错误。现在我的标准操作是：每完成一个模块（约15轮对话），就保存当前代码快照，然后开启新会话。新会话的第一条消息永远是：“继续开发宠物生命周期管理App，技术栈：Next.js 14 + tRPC + Prisma + SQLite。核心约定：① 所有API返回JSON；② 禁止使用localStorage；③ CSV导出仅用Papaparse”。这个习惯让后续开发错误率下降76%。

5.3 “类型漂移”问题：TypeScript接口在多次迭代中悄然变异

在“健康指标”模块中，我最初定义的HealthMetric接口是：

interface HealthMetric { id: string; petId: string; type: 'weight' | 'temperature' | 'heartRate'; value: number; unit: string; recordedAt: Date; }

但经过5次迭代后，Claude生成的代码中，unit字段变成了可选（unit?: string），value类型变成了string | number。这是因为每次修改都基于局部需求（如“体温单位可以是℃或℉”），AI没有全局视角。我的解决方案是：建立中央类型定义文件，所有接口变更必须在此文件中统一管理。我创建了types/index.ts，并强制Claude在每次生成新类型时，都引用此文件：

// types/index.ts export interface HealthMetric { id: string; petId: string; type: 'weight' | 'temperature' | 'heartRate'; value: number; unit: 'kg' | 'g' | '℃' | '℉' | 'bpm'; // 显式枚举所有单位 recordedAt: Date; }

然后在提示词中强调：“所有代码必须导入并使用types/index.ts中的类型，禁止重新定义同名接口”。这个措施让类型一致性从68%提升至100%。

5.4 “性能幻觉”误区：AI生成的代码在大数据量下必然崩溃

Claude生成的“宠物健康趋势图”组件，使用了Array.map()遍历所有历史记录来计算月度平均值。这在测试数据（100条）下运行流畅，但当导入真实用户数据（10,000+条）时，页面直接卡死。我原以为需要重写算法，但Claude给出的优化方案出人意料：“将聚合计算移至数据库层，使用Prisma的groupBy()方法”。它生成的代码是：

// 优化前（前端计算） const monthlyStats = records.reduce((acc, record) => { const month = format(record.recordedAt, 'yyyy-MM'); if (!acc[month]) acc[month] = []; acc[month].push(record.value); return acc; }, {} as Record<string, number[]>); // 优化后（数据库聚合） const monthlyStats = await prisma.healthMetric.groupBy({