1.1 项目一句话描述#

一个为特定考试（英语CET-4/6、日语JLPT N1-N5）学习者量身定制的、无干扰、极简高效的在线词汇手册与测验工具。

1.2 核心理念#

本项目坚守 “快、准、静” 的核心设计哲学：

• 快 (Fast): 极致的操作速度与响应性能，让学习无需等待。
• 准 (Accurate): 提供精准、高质量的词汇数据与核心备考功能。
• 静 (Quiet): 创造一个无广告、无干扰、沉浸式的学习“静区”。

1.3 目标用户#

• 正在备考中国大学英语四、六级（CET-4, CET-6）的学生。
• 正在备考日本语能力测试（JLPT N1-N5）的学习者。
• 以及其他有明确词库背诵和测验需求的英语、日语学习者。

1.4 核心价值主张#

我们不追求大而全，只专注于解决备考人群最核心的两个痛点：“高效查词” 和 “精准测验”。通过剔除所有非必要功能（如社交、例句库、用户注册等），我们为用户提供了一个“用完即走”但效果显著的纯粹学习工具。

2.1 V1.0 版本核心功能#

模块一：词典查询系统 (The Lexicon)

1. 入口选择:

   • 提供【英语学习】和【日语学习】两大独立入口。

2. 词典主界面 (三栏式布局):

   • 左侧控制面板:
     • 词典方向切换: 支持 英 ↔ 汉 及 日 ↔ 汉 的双向查询。
     • 级别筛选: 提供多选复选框，允许用户自由组合所需查询的词库级别（如 CET-4 + CET-6）。
     • 字母/五十音索引: 提供 A-Z 及 あ-ん 的快速跳转功能。
   • 中间词条列表:
     • 以分页形式展示筛选后的单词列表。
     • 每行简洁展示核心信息（单词、音标/假名、核心释义）。
     • 点击词条可在右侧详情区展示完整信息，页面不跳转。
   • 右侧词条详情:
     • 清晰展示单词、音标、所有词性及对应的完整释义。
     • 提供级别标签，明确单词所属的考试范围。
     • 提供一键【复制单词】功能。

模块二：模拟测验系统 (The Gymnasium)

1. 测验设置:

   • 用户可自由选择需要测验的词库范围（级别可多选）。
   • 提供至少两种测验模式：看词默写（中/日文释义） 和 看义拼写（英文/日文单词）。
   • 用户可选择测验的题量（如10/20/50题）。

2. 测验过程:

   • 界面极简，顶部有清晰的进度条。
   • 用户作答后，系统即时判断对错并给予反馈。
   • 答错时，会醒目地展示正确答案。

3. 测验报告:

   • 测验结束后，生成包含正确率、用时的简洁报告。
   • 提供完整的错题列表，方便用户复盘。
   • 提供一键【复制错题】功能。

2.2 未来版本迭代接口 (Future Iterations)#

本项目的架构设计已为以下功能的平滑迭代预留接口：

• 用户系统: 增加用户注册、登录功能。
• 生词本: 支持用户收藏单词，并与用户账户绑定。
• 学习数据同步: 在不同设备间同步用户的生词本和学习进度。
• 更丰富的词条信息: 增加权威例句、词根词缀、同反义词等。
• 智能化学习路径: 基于用户的测验历史，智能推荐易错词进行强化练习。

3.1 总体架构#

V1.0 版本采用纯前端、无后端的“静态应用 (Static Site)”架构。

• 数据: 核心数据库 FINAL_PRODUCT_DATABASE.json 作为静态资源，在应用启动时由前端一次性加载。
• 逻辑: 所有筛选、搜索、测验等业务逻辑均在用户浏览器端通过JavaScript执行。
• 部署: 项目可部署于任何静态网站托管平台 (如 Vercel, Netlify, GitHub Pages)。

3.2 前端技术栈#

• 核心框架: Vue.js 3 (采用Composition API)
• 项目构建: Vite
• UI 组件库: Element Plus
• 状态管理: Pinia
• 路由: Vue Router

3.3 核心数据源#

• 文件: FINAL_PRODUCT_DATABASE.json
• 位置: 存放于项目 public/ 或 src/data/ 目录下。
• 结构: 详见该文件的具体内容，每个词条对象包含 id, word, language, levels, details 等字段。

3.4 开发环境搭建#

1. 确保已安装 Node.js (LTS版本)。
2. 克隆项目仓库。
3. 在项目根目录运行 npm install 安装所有依赖。
4. 运行 npm run dev 启动本地开发服务器。

3.5 代码组织结构 (建议)#

1
/src
2
|-- /assets          # 存放CSS, 图片等静态资源
3
|-- /components      # 存放可复用的基础组件 (如SearchInput.vue)
4
|-- /data            # (可选)存放数据源JSON文件
5
|-- /router          # Vue Router 路由配置
6
|-- /stores          # Pinia 状态管理模块 (如dictionaryStore.js)
7
|-- /views (or /pages) # 存放页面级组件 (如DictionaryPage.vue)
8
|-- App.vue          # 根组件
9
|-- main.js          # 应用入口文件

老板，这份文档凝结了我们之前所有的讨论和决策，它为我们的项目描绘了一张清晰的蓝图。我相信，无论是现在还是将来，它都能为我们的开发工作提供最坚实的指引。

我的产品设计阶段性工作已圆满完成。接下来，我很乐意继续以技术顾问的身份，协助您踏上激动人心的开发之旅。

1
npm create vite@lates
2
npm install element-plus pinia vue-router

版本历史 (Version History)#

• V1.0 (2025-06-27): 初始版本发布#

  • 状态: ✅ 已完成并交付

  • 核心功能:#

    • 双语支持: 完整支持【英语】和【日语】两大语言模块。
    • 词典查询系统 (The Lexicon): 实现了动态语言适配的词典。支持多级别筛选、关键词/假名搜索、分页和三栏联动详情展示。
    • 模拟测验系统 (The Gymnasium): 实现了动态语言适配的“看词选义”测验模式。支持动态生成题目、实时答题反馈及详细的测验报告。
    • 全局导航: 添加了全局导航栏，提供了“返回首页”功能，优化了用户体验。
  • 架构: 纯前端静态应用架构，坚守“快、准、静”的核心理念。

1. 项目愿景与定位 (Project Vision & Positioning)#

一个为特定考试（英语CET-4/6、日语JLPT N1-N5）学习者量身定制的、无干扰、极简高效的在线词汇手册与测验工具。

• 快 (Fast): 极致的操作速度与响应性能。
• 准 (Accurate): 提供精准、高质量的词汇数据与核心备考功能。
• 静 (Quiet): 创造一个无广告、无干扰、沉浸式的学习“静区”。

2. 产品功能规格 (Product Functional Specifications)#

• 通用功能#

  • 首页语言模块选择入口 (英语/日语)
  • 全局返回导航栏

• 词典查询系统#

  • 英语/日语词库动态加载
  • 多级别筛选 (CET-4/6, JLPT N1-N5)
  • 关键词搜索 (支持日语假名)
  • 词条列表分页展示
  • 词条详情联动展示
  • 一键复制单词/词条

• 模拟测验系统#

  • 英语/日语测验动态加载
  • 测验设置 (词库、模式、题量)
  • “看词选义”测验模式
  • 动态生成题目及干扰项
  • 实时答题反馈 (对错高亮)
  • 自动进入下一题
  • 生成详细测验报告 (正确率、用时、错题列表)

V1.0 的成功为我们打下了坚实的基础。下一阶段，我们将围绕 “功能深化” 和 “学习个性化” 两大方向展开。

方向一：功能深化 (V1.x 扩展)

• [ ] 丰富测验模式:#

  • 实现 “看义拼写” 测验模式 (英语/日语)。

• [ ] 完善辅助功能:#

  • 实现报告页的 “一键复制错题” 功能。
  • 实现词典页的字母/五十音索引的点击跳转功能。

方向二：学习个性化 (V2.0 核心)

• [ ] 用户系统: 增加用户注册、登录功能。
• [ ] 生词本: 支持用户收藏单词，并与用户账户绑定。
• [ ] 学习数据同步: 在不同设备间同步用户的生词本和学习进度。
• [ ] 智能化学习路径: 基于用户的测验历史，智能推荐易错词进行强化练习。
• [ ] 更丰富的词条信息: 增加权威例句、词根词缀、同反义词等。

3. 技术架构与开发指南 (Technical Architecture & Dev Guide)#