【用 AI 】从 0 到 1：我用 TRAE 开发了一套"民宿+商城"微信小程序系统
一、我的身份 / 阶段
- 独立开发者，技术背景是 Python / 计算机视觉方向，并非前端科班出身
- 阶段：一个人包揽了从需求梳理 → 技术方案 → 三端开发 → 联调测试 → 上线的全流程
- 没有前端团队，微信小程序端、管理后台、后端服务三端全部靠 AI 辅助一个人交付
二、我的项目任务
背景：一家民宿要上线完整的"在线预订 + 商城"业务，需要同时交付三端系统：
| 端 | 技术栈 | 核心模块 |
|---|---|---|
| 微信小程序（C 端） | TypeScript | 落地页、门店列表、民宿详情与房型预订、订单、商城（商品/购物车/结算/地址）、积分与积分商城、优惠券、邀请分销、发票、实名认证 |
| 管理后台（B 端） | Vue 2 + Element UI | 订单管理、房间看板、房型/房间管理、优惠券、会员、积分、分享管理、发票、统计报表 |
| 后端服务 | Go + Gin + MySQL | 微信无感登录、微信支付回调、邀请绑定与奖励、消息通知（邮箱/企业微信/订阅消息）、定时任务 |
难点：微信生态规则复杂（支付、分享、发货、订阅消息），加上"民宿库存 + 商城订单 + 积分奖励"的交叉业务，一个人从零写很容易失控。
三、我用了什么 AI 工具
- TRAE（AI IDE）：主力工具。在编辑器里直接用对话方式改代码，支持跨文件修改、代码补全、报错诊断、生成 SQL 和文档
- 配合微信开发者工具做真机/页面验证，配合浏览器开发者工具调试管理后台
- 没有用低代码平台：支付、预订、库存、积分等核心业务全部是代码实现，AI 负责"写、改、查"三件事
四、我是怎么做的
阶段 1：先让 AI 写"规格文档"，再写代码
每个功能先让 TRAE 生成 spec.md + checklist.md + tasks.md，把模糊需求拆成可执行、可验收的小任务，然后再动代码。给 AI 的指令示例（可直接复用）：
请基于以下需求生成规格文档 spec.md：
1. 民宿微信小程序需要支持分享功能，用户在小程序任意页面都可分享卡片给好友
2. 新用户通过分享卡片进入首页并完成注册后，与分享人建立绑定关系
3. 新用户首次支付成功民宿订单后，分享人获得可配置的积分奖励
要求：给出涉及字段说明、接口定义（路径/参数/响应）、关键业务流程、验收标准、检查清单
这样做的收益：需求在写码前就被拆清，AI 后续改代码也有"锚点"，减少返工。
阶段 2：三端骨架 + 分模块迭代
- 先让 AI 搭骨架：小程序
app.json一次注册 30 个页面、管理后台路由、后端 handler/service/repository 分层 - 每个业务功能一个迭代闭环：AI 生成代码 → 我在微信开发者工具 / 管理后台实测 → 有问题直接让 AI 修
- 通用逻辑（登录态、请求封装、分享、通知）做成统一入口，一次实现全端复用
阶段 3：让 AI 排查线上反馈的 Bug
真实案例：分享卡片"标题错乱 + 截图"
用户反馈：部分页面转发给好友后，卡片显示的是当前页面的截图和默认标题，而不是统一文案"想把这片山水，分享给你"。
排查过程（这是我与 AI 协作最典型的例子）：
- 我先梳理分享机制：统一通过"全局重写 Page 构造器"注入
onShareAppMessage，标题/图片统一，路径指向首页并携带邀请人 ID - 让 TRAE 对比所有页面分享入口的差异，定位到 company-list 页面自带一份页面级
onShareAppMessage，但漏了引入 config 模块，调用时抛异常 - 微信捕获异常后自动回退默认分享（截图 + 默认标题），所以表现成"截图错乱"
- 让 AI 补上缺失的引入并全量排查其它页面 → 确认只有这一处
阶段 4：数据库与迁移脚本
字段清单确认后，让 AI 生成 SQL 迁移脚本（建表、加字段、初始化数据），在本地执行验证后再上环境，避免手工写 SQL 的笔误。
五、结果如何
- 交付三端系统：小程序 30+ 页面、管理后台完整业务模块、后端 50+ 接口，全部走微信支付真实交易
- 上线功能包括：民宿预订与支付、商城购物、积分与积分商城、优惠券、邀请分销奖励、发票、实名认证、邮箱/企业微信/订阅消息通知
- 已交给真实民宿投入使用，并持续按用户反馈迭代
六、踩坑和提醒
| 坑 | 具体表现 | 提醒 |
|---|---|---|
| 微信分享方法放 Behavior 不生效 | 用全局 Behavior 混入onShareAppMessage，右上角"转发"按钮不出现 |
微信"页面级能力"只认 Page 配置对象上的直接声明，别用全局混入 |
| AI 生成"不存在的配置" | 网上文章说 page.json 配enableShareAppMessage 可开分享，实际微信无此配置 |
微信生态功能先查官方文档，再让 AI 落地，别让 AI 猜 |
| 分享卡片回退默认 | 页面onShareAppMessage 抛异常时，微信静默回退为页面截图 + 默认标题 |
分享统一走全局注入，并逐个页面真机验证 |
| 朋友圈分享的平台限制 | onShareTimeline 只能分享当前页面，无法指定落地首页 |
涉及落地的需求要先确认平台能力边界 |
必须人工核查的部分（AI 不能替代专业判断）：微信支付回调、实名认证、订单金额计算、隐私合规声明、定时任务的数据一致性。AI 生成的支付/对账相关代码我会逐行对照官方文档复核。
七、可复制建议
- 先规格后代码：让 AI 先产出 spec/checklist/tasks 再写码，需求不清晰时绝不直接开写
- 通用逻辑用"全局注入/统一入口"：登录、分享、请求封装做成一处，让 AI 改一处全端生效
- 微信能力先查官方文档：支付、分享、发货、订阅消息这些平台能力，先读文档再让 AI 实现，能省大量返工
- 分阶段 git 提交：每个功能一个提交，出问题随时让 AI 对比历史版本定位回归