Appearance
技术选型（为什么是 uni-app/Vue）
不是追热点，而是「这套栈 + AI Coding」能最快交主路径，并留小程序出口。
AI CODING · 场景二 · 选型
把选型与目录责任写成可 @ 的文档。AI 越界时，用约定打回，而不是口头争论。
时间 40–60 分钟产出 architecture 备忘验收 能预览 / 能说明
本节要点
- 一份可粘贴进 Prompt 的选型决策段
- pages / components / domain / data 谁干什么、谁不能 import 谁
- 落备忘 +（可选）空骨架的两张给 AI 的 Prompt
为什么选这套
文案约定 · AI Coding 选型类内容少用「不做清单表」。优先对比（备选做法 vs 推荐做法），再写清选型说明与本节练习目标。表格留给字段对照、目录责任这类真要扫列的信息。
本切片交付目标是「今天吃什么」主路径可预览，而不是一次装齐生产级依赖。以下三组对比给出推荐做法，并附选型说明。
运行时：多端壳 vs 换栈重写
备选做法
一上来 React Native / Flutter，「更现代」。 推荐做法
uni-app + Vue 3，H5 验收，保留小程序出口。 选型说明： 现网生活小程序就是这套语法与目录习惯；课上练的是「怎么跟 AI 卡边界」，不是再学一门原生壳。换栈的成本会吞掉整晚的主路径。没有小程序工具链时，用 Vue + Vite H5 练同一套目录与契约即可——备忘里写一句「语法对齐 uni-app」就够。
数据：先 Mock vs 先接真接口
备选做法
第一天鉴权、支付、联真库，「显得完整」。 推荐做法
本地 Mock，字段名按以后 REST 起名；真接口留给场景三。 选型说明： 场景二要练的是目录分工、组件契约、筛选纯函数。后端没就绪时，Mock 照样能演示「选用餐场景 → 列表 → 详情」。字段名现在就对齐合同，场景三才接得上，而不是两边各造一套同义词。
依赖与状态：最小可用 vs 过早引入全家桶
备选做法
UI 组件库一把梭、Pinia 先搭好、顺手改 lockfile。 推荐做法
TypeScript 锁契约 + 首页本地 ref；单测护筛选/查找。 选型说明： 模型常见倾向是「装依赖显得专业」——体积和锁文件一炸，diff 就看不清业务改动。本切片状态只是「当前用餐场景」，本地 ref 够用；类型用来卡住 MealSceneId / Dish，比再引一层状态库更值钱。
壳上别的能力，先不展开
晨悦·生活真仓还有家庭成员（宝宝 / 老人 / 毛孩子 / 孕期）、定位转盘等。壳是生活小程序，切片只练「今天吃什么」——不是它们不重要，本节要把「对比选型 → 写进备忘 → 打回越界」练到可复用。成员页、转盘以后按同一写法再开切片即可。
决策段（可贴进 Prompt）
给人看的是上面三组对比；给 AI 的是下面这段原文——写进 architecture、或贴在Prompt 开头，用来打回越界。
给 AI · 选型决策段整段复制给 AI；人或备忘里也可以存同一份
text
我们做晨悦·生活小程序教学切片（默认「今天吃什么」：用餐场景 → 菜品列表 → 详情）：
- 运行时：uni-app + Vue 3 + TypeScript（无工具链时用 Vite H5，备忘写明）
- 本切片验收以 H5 预览为主，保留小程序入口
- 数据：本地 Mock；字段名按以后 REST 契约起名
- 壳上另有家庭成员设置（宝宝 / 老人 / 毛孩子 / 孕期等），本切片不实现成员页
- 不要：React Native、大型 UI 库、鉴权支付、定位转盘、提前接真接口色块约定：蓝 = 给 AI 的上下文；紫 = 给 AI 的 Prompt（任务）；琥珀 = 给 AI 的纠错 Prompt。
## 目录与依赖方向text
pages → components / domain / data
components → （只收 props，不依赖 data 细节）
domain → （纯函数，不依赖 Vue 与网络）
data → domain 类型（或并列，但不反向依赖 pages）| 目录 | 责任 | 本切片典型文件 |
|---|---|---|
| pages | 状态、组合、导航 | 首页、详情页 |
| components | 展示 + 上报事件 | ScenePicker、DishCard |
| domain | 校验、筛选、查找 | mealScenes、dishes |
| data | Mock | dishes mock |
越界信号（看到就停）
- 卡片组件里直接写
uni.navigateTo - 首页复制一份
filter，domain 里还有一份 - data 里另造一套用餐场景字符串（不走
MealSceneId） - AI「顺便」改
package.json/ lockfile
能说清一句：为什么不在 DishCard 里写路由——选型才算过。
备忘骨架示意（对照用，勿整段交差）
markdown
# Architecture · 今天吃什么（教学切片）
## 选型
（粘贴上一节决策段）
## 目录责任
| 目录 | 责任 | 禁止 |
| pages | … | … |
| components | … | 自己跳转、自己维护场景表 |
| domain | … | 请求网络、改样式 |
| data | … | 第二套场景 id |
## 依赖方向
pages → components / domain / data；domain 不依赖 Vue
## 主路径
打开首页 → 选一人食 → 见菜品卡 → 点番茄炒蛋进详情（含小贴士）跟做步骤
- 新建或打开仓库里的
docs/architecture.md（路径按你约定）。 - 新开对话，贴下方「落选型文档」Prompt。
- 看复述：四级标题是否齐全；不对就改卡，禁止它先写。
- 确认后落文件；对照真实目录改到一致。
- （可选）空仓再跑「目录骨架」卡，只要 Hello 预览。
- 勾验收清单后再进 Prompt 策略。
给 AI 的 Prompt · 落选型文档
给 AI · Prompt · 写 architecture 备忘
text
【目标】新增或更新 docs/architecture.md（路径按你仓库约定）。
【必须包含】
1. 技术选型表（选什么 / 本切片负责什么 / 暂不展开）
2. 目录责任表（pages/components/domain/data）
3. 依赖方向（谁可以 import 谁）
4. 主路径四步的文字描述（今天吃什么）
【不要】
- 生成业务页面实现
- 安装新依赖、改 lockfile
【请你】先复述将写入的四级标题，我确认后再写文件。给 AI 的 Prompt · 最小目录骨架（可选）
若仓库还是空的：
给 AI · Prompt · 目录骨架
text
【目标】按 architecture 给出最小目录与空入口，能跑通开发预览「Hello」。
【要有】pages 入口、components / domain / data 空目录、README 启动说明
【不要】菜品筛选与 Mock、大型 UI 库、鉴权、成员页
【请你】先列文件树，确认后再创建。验收
- [ ] architecture（或等价）可被
@，且与仓库目录一致 - [ ] 能说明：为什么不在 DishCard 里写路由
- [ ] 开发预览能打开（哪怕还是空白首页）
- [ ] 备忘里写清：本切片是「今天吃什么」，不是成员设置 / 阶段推荐
下一步 → 页面拆解与 Prompt 策略。