SkillMap 项目进展日志｜组件优化 + 路线图初步完成

在过去的一天里，完成了 SkillMap 项目的一轮关键更新。本次更新主要围绕以下几点展开：

✅ 新增 Roadmap 视图（技能路径图）

我引入了一个全新的页面模块 road-map/，用于展示不同职业路径的技能推进顺序。

• 支持从数据结构中解析技能路径（SkillRoad.ts）
• 每个路径可以定义技能 ID 与权重，后续将用于路径推荐与评估
• 页面设计保持可扩展，未来将支持 AI 推荐与路径评分算法

🧩 增加通用 UI 组件

为了支撑新视图与交互，我加入了以下基础组件并完成样式适配：

• <Popover />：用于点击技能点时弹出操作选项
• <Tabs />：支持技能展示视图切换（卡片 / 列表 / 图谱）
• <Tooltip />：节点 hover 时显示补充信息

此外，还优化了 <Badge /> 样式，并使其更易于复用。

🧠 SkillCard 与 SkillDrawer 改进

• SkillCard 支持展示更完整的标签与状态
• SkillDrawer 交互更加流畅，支持点击卡片快速展开技能详情
• Skill 状态支持更新同步数据，并做了抽屉高度适配优化

⚙️ 技术调整与配置优化

• 更新了 tag 数据结构，适配分组展示
• 补充并注册了 roadmap 的路由配置
• package.json 和 yarn.lock 有少量依赖调整（后续打包更快）

🗂️ Git 提交记录结构（参考）

• feat(skill-map): add roadmap view and skill path data
• feat(ui): add popover, tabs, and tooltip components
• refactor(skill-map): improve layout structure and skill drawer interaction
• chore(ui): tweak Badge component styles
• chore: auto-fix lint issues

🔜 下一步计划

• 添加 roadmap 视图的节点连线（可选）
• 拆解职业路径模板（独立开发者 / 电商专家）
• 增加「技能对路径的影响评分」可视化
• Blog/README 添加路径规划可视图截图
• 思考是否通过 JSON → AI 自动生成路径建议

SkillMap 项目已经渐渐从一个“技能录入器”演进为一个可以承载个人成长路径管理的图谱工具。

希望在本月末发布第一个正式版，供我自己和感兴趣的朋友一起使用 🙌

👉 回到 SkillMap 主页