2026-08-26 16:20:55 +08:00

1.8 KiB
Raw Blame History

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.xcreate-vue 脚手架默认Vapor Mode 为 3.6 RC不启用
  • Vite 6.xNode ≥ 18本机 Node 24 满足;若装 Vite 7 亦可)
  • TypeScript 5.8.xstrict + 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、不做多端不必提前押注
  • ADR-005monorepo 布局,前端经 packages/shared 共享类型)
  • ADR-004全 TS strict + zod