fix(*): skill 更新

8d5ae395 · chunhong.mu · 9c433a9f · 8d5ae395
Commit 8d5ae395 authored Jul 29, 2026 by chunhong.mu
Showing with 23 additions and 54 deletions
.claude/skills/figma-restore/SKILL.md
--- a/.claude/skills/figma-restore/SKILL.md
+++ b/.claude/skills/figma-restore/SKILL.md
@@ -12,7 +12,7 @@ description: 从 Figma 设计稿还原 H5/Web 页面，支持 Vue3 / React / Uni
 > **🚀 Figma 还原启动**
 > 本次将自动执行以下操作，无需逐步确认：
 > - 调用 Figma API 读取设计稿节点数据
-> - 下载图片资产到目标包的静态资源目录（如 `packages/<pkg>/public/img/`，小程序为 `src/static/img/`）
+> - 下载图片资产到对应分包的 `packages/***/public/img/` 目录，适当的位置
 > - 生成/更新组件与路由代码
 >
 > 如需中断，随时发送"停止"。
@@ -163,41 +163,24 @@ Header: X-Figma-Token: <token>
 ## ④ 技术栈感知（每次执行前必做）
-### ④.0 先确定目标包（monorepo 必做）
+还原前先读取项目技术栈与代码规范，生成代码必须与项目现有风格一致：
-本仓库是 pnpm monorepo，还原前**必须先确定目标包**，所有后续读写都限定在该包内：
+- 读取 `package.json` 的 `dependencies` 和 `devDependencies`，确认框架、UI 库、CSS 方案
+- 读取 `src/components/` 目录列表，了解已有组件
-| 包 | 类型 | 路由定义 | 页面目录 | 组件目录 | 静态资源 |
+- 读取 `src/router/index.*`，确认路由结构
-|----|------|---------|---------|---------|---------|
-| `packages/admin` | Vue 3 SPA 后台 | `src/router/index.ts` | `src/pages/` | `src/components/` | `public/` |
-| `packages/web` | Vue 3 SPA H5/客户端 | `src/router/index.ts` | `src/pages/` | `src/components/` | `public/` |
-| `packages/mini` | UniApp 小程序 | `src/pages.json` | `src/pages/` | `src/components/` | `src/static/` |
-| `packages/site` | Nuxt 3 官网 | 文件路由 | `pages/` | `components/` | `public/` |
-如果用户没说明目标包，**直接问**，不要猜。图片资产下载到目标包对应的静态资源目录下（如 `packages/<pkg>/public/img/...`）。
-### ④.1 读取技术栈
-还原前先读取目标包的技术栈与代码规范，生成代码必须与项目现有风格一致：
- 读取 `packages/<pkg>/package.json` 的 `dependencies` 和 `devDependencies`，确认框架、UI 库、CSS 方案
- 读取组件目录列表，了解已有组件
- 读取路由定义，确认路由结构
- 读取根目录 `eslint.config.mjs`，确认代码风格（本仓库：4 空格缩进、双引号、无分号）
 根据读取结果确认以下上下文，后续代码生成全部遵循：
 | 检查项 | 读取位置 | 影响 |
 |--------|---------|------|
-| 框架 | `packages/<pkg>/package.json` | Vue3 SPA / Nuxt / UniApp |
+| 框架 | `package.json` | Vue3 / React / UniApp / Flutter / 纯HTML |
-| UI 组件库 | `package.json` dependencies | Ant Design Vue / 无 |
+| UI 组件库 | `package.json` dependencies | Vant / Element Plus / Ant Design / 无 |
-| CSS 方案 | `package.json` + `vite.config.*` | SCSS / UnoCSS |
+| CSS 方案 | `package.json` + `vite.config.*` | SCSS / Tailwind / CSS Modules |
 | TypeScript | `tsconfig.json` 是否存在 | props/emits/hooks 类型标注 |
-| 全局样式 Token | `src/assets/styles/` | 优先使用已定义变量 |
+| 全局样式 Token | `src/styles/` 或 `src/assets/styles/` | 优先使用已定义变量 |
-| 现有组件 | 组件目录列表 | C.O.D.E 评估 |
+| 现有组件 | `src/components/` 目录列表 | C.O.D.E 评估 |
-| 路由结构 | 见上表 | 路由挂载点与 Layout |
+| 路由结构 | `src/router/index.*` | 路由挂载点与 Layout |
-| Layout 组件 | `src/components/layout/` 或 `App.vue` | 哪些全局元素已由 Layout 处理 |
+| Layout 组件 | `src/layouts/` 或 `App.vue` | 哪些全局元素已由 Layout 处理 |
-| 跨包复用 | `common/vue-kit`、`common/utils` | 通用组件/函数优先复用，不要重复实现 |
 ---
@@ -483,7 +466,7 @@ Web 设计稿通常包含全局 Layout（顶部导航、侧边栏），路由组
 #### 1. 定位路由挂载点
-读取目标包的路由定义（`src/router/index.ts`；小程序为 `src/pages.json`；Nuxt 为文件路由）、`src/App.vue`、`src/components/layout/`（如存在），确认路由挂载方式与 Layout 结构。
+读取 `src/router/index.*`、`src/App.vue`、`src/layouts/`（如存在），确认路由挂载方式与 Layout 结构。
 #### 2. 复杂页面判定与骨架搭建
@@ -511,10 +494,10 @@ Web 设计稿通常包含全局 Layout（顶部导航、侧边栏），路由组
  <div class="page home-page">
    <section class="section hero-section">
      <div class="page-content">
-        <p class="section__eyebrow">副标题</p>
+        <p class="section__eyebrow">亲亲企服</p>
-        <h1 class="section__title">主标题</h1>
+        <h1 class="section__title">六大服务场景</h1>
        <div class="section__actions">
-          <button class="btn btn--primary">主按钮</button>
+          <button class="btn btn--primary">免费咨询</button>
        </div>
        <div class="image-ph image-ph--hero"><span>Hero 主视觉</span></div>
      </div>
@@ -597,9 +580,9 @@ Web 设计稿通常包含全局 Layout（顶部导航、侧边栏），路由组
 | 优先级 | 类型 | 检查项 |
 |--------|------|--------|
-| **C** | Component | 目标包 `components/` 与跨包 `common/vue-kit` 是否已有可复用组件 |
+| **C** | Component | `src/components/` 是否已有可复用组件 |
-| **O** | Open Source | Ant Design Vue（admin/site）等已装 UI 库是否有现成组件 |
+| **O** | Open Source | Vant / Element Plus / Ant Design 是否有现成组件 |
-| **D** | Design System | 项目全局样式（`src/assets/styles/`）是否已定义颜色/间距 token |
+| **D** | Design System | 项目全局样式是否已定义颜色/间距 token |
 | **E** | External | 图标 SVG 是否已下载到图标目录 |
 复用 > 改写现有 > 新建。仅在 C/O/D/E 均无合适选项时才新建组件。
@@ -1138,34 +1121,20 @@ H5 移动端当用户明确要求响应式时，才生成多尺寸 `srcset`。
 遍历节点树，找到所有 `fills` 中 `type === "IMAGE"` 的节点，记录其 `imageRef`。
 调用 `GET /v1/files/{fileKey}/images` 获取 imageRef 对应的实际 URL，下载保存。
-#### 添加路由
+#### 添加路由（Vue Router 示例）
-**Vue 3 SPA（`packages/admin`、`packages/web`）** — `src/router/index.ts` 的 routes 数组末尾追加：
 ```typescript
+// src/router/index.ts — routes 数组末尾追加
 {
  path: '/<page>',
  name: '<PageName>',
-  component: () => import('@/pages/<page>/index.vue'),
+  component: () => import('@/views/<PageName>View.vue'),
-  meta: { title: '<页面标题>', requiresAuth: true },
 },
 ```
-**UniApp 小程序（`packages/mini`）** — 在 `src/pages.json` 的 `pages` 数组中追加：
-```json
-{
-  "path": "pages/<page>/index",
-  "style": { "navigationBarTitleText": "<页面标题>" }
-}
-```
-**Nuxt 官网（`packages/site`）** — 文件路由，只需新建 `pages/<page>.vue` 或 `pages/<page>/index.vue`，无需注册。
 #### 验证
- **类型检查**：`pnpm -F <pkg> type-check`
+- **TypeScript 检查**（如项目有 TS）：`npx vue-tsc --noEmit` 或 `npx tsc --noEmit`
- **代码风格**：`pnpm lint:fix`（`@antfu/eslint-config`，4 空格缩进 / 双引号 / 无分号）
 - **页面截图验证**（确认 dev server 已运行）：使用浏览器截图工具或 Playwright 访问页面 URL 截图
 ---