# ADR-002: 使用 Vue 3 + Vite 构建响应式前端 ## Status: Accepted (2026-08-26) ## Background 「备考中枢」是响应式 Web(移动优先,碎片双峰刷题;桌面兼顾模考与复盘导出)。前端框架用户已选定 Vue3。需要移动端快、桌面端稳、带图表(数据中枢/模考分析)、且能与后端共享同一套由 zod schema 单一契约源产出的类型契约。 ## Decision 采用 **Vue 3.5.x + Vite 6.x + TypeScript 5.8.x**,配 Vue Router 4 + Pinia。版本锚定: - Vue `3.5.x`(create-vue 脚手架默认;Vapor Mode 为 3.6 RC,不启用) - Vite `6.x`(Node ≥ 18;本机 Node 24 满足;若装 Vite 7 亦可) - TypeScript `5.8.x`(strict + any 全禁,配合 vue-tsc) 选型理由: 1. 技术矩阵定位:Vue 3 在「快速原型/内容站」MVP 速度 5/5、生态 4/5(对照 `mvp-stack.md`)。 2. 响应式优先:Vue 响应式系统天然适合「刷题状态 / 统计卡刷新」这类高频数据驱动 UI。 3. 组合式函数(composables)契合「按资源分包、单文件 ≤ 300 行」规范,逻辑组件化。 4. 前端目录规范(前端专家包 `方案 B`)明确 `components/composables/views/stores/services/types` 分层,与项目架构一致。 5. 图标锁定一套 SVG 图标库(设计阶段选定并全局统一,不混用;API/架构文档不出现 emoji)。 ## Consequences - 正面:响应式、生态成熟、与 TS 结合良好、脚手架即含类型检查。 - 负面:Vue 3.5 尚在 Vapor Mode 前,SSR 能力弱(本项目为纯客户端 SPA,无需 SSR)。 - 权衡:不为「未来可能的多端」预置 Taro/uni-app(产品已明确不做原生 App、不做多端,不必提前押注)。 ## Related ADRs - ADR-005(monorepo 布局,前端经 `packages/shared` 共享类型) - ADR-004(全 TS strict + zod)