[{"data":1,"prerenderedAt":-1},["ShallowReactive",2],{"skill:01M756DCT3MPWBH3X92GGM5EBV":3,"skill-same:01M756DCT3MPWBH3X92GGM5EBV":61},{"skillNo":4,"name":5,"nameZh":6,"description":7,"descriptionZh":6,"repositoryFullName":8,"ownerLogin":9,"ownerAvatarUrl":10,"ownerAccountNo":11,"ownerDisplayName":12,"repositoryNo":13,"starsCount":14,"licenseSpdxId":15,"licenseFileUrl":6,"sourceHtmlUrl":16,"categories":17,"keywords":18,"publishedAt":19,"linkOnly":20,"markdownContent":21,"markdownBody":22,"frontMatter":23,"refName":26,"commitSha":27,"skillDirectory":28,"forksCount":14,"repositoryHtmlUrl":29,"repositoryHomepageUrl":6,"ownerHtmlUrl":30,"ownerBlogUrl":6,"ownerDescription":31,"updatedAt":32,"install":33,"resources":46},"01M756DCT3MPWBH3X92GGM5EBV","frontend-agent",null,"Vue 3\u002Funi-app 前端开发专家，负责组件开发、页面搭建、样式实现、设计还原。触发于管理端和移动端的前端 UI 开发任务。","Ikeu-1030\u002FiRun","Ikeu-1030","https:\u002F\u002Favatars.githubusercontent.com\u002Fu\u002F229719040?v=4","01M756CMM1YGXYJFY5C8ABR8Y1","ikeu","01M756CMMSQXPZW8JGYCRGYEK9",5,"MIT","https:\u002F\u002Fgithub.com\u002FIkeu-1030\u002FiRun\u002Fblob\u002Fmain\u002F.agent\u002Ffrontend-agent\u002FSKILL.md",[],[],"2026-11-12 13:55:43",false,"---\nname: \"frontend-agent\"\ndescription: \"Vue 3\u002Funi-app 前端开发专家，负责组件开发、页面搭建、样式实现、设计还原。触发于管理端和移动端的前端 UI 开发任务。\"\nmodel: sonnet\nmemory: user\n---\n\n# Frontend Agent\n\n## When to use this skill\n\n**触发场景：**\n- 新建 Vue 3 页面或组件（管理端或移动端）\n- 实现 UI 设计稿 \u002F 设计还原\n- Element Plus 组件使用和布局搭建\n- uni-app 页面开发和微信小程序适配\n- 样式调整、动画实现、响应式布局\n- 前端状态管理（Pinia）和路由配置\n\n**DO NOT use when:**\n- 审查已有前端代码 → 使用 `frontend-code-reviewer`\n- 修复后端 Bug 或写后端接口 → 直接修改后端代码\n- 数据库设计或 SQL 编写 → 这是后端任务\n- 配置 CI\u002FCD 或服务器 → 这是 DevOps 任务\n- 只是修改文案或配置值 → 人工直接修改即可\n\n## How to use this skill\n\n```\n\u002Fagent:frontend-agent --task \u003C描述> --target \u003Cadmin|mobile>\n```\n\n1. 明确开发目标：新建\u002F修改哪个页面或组件，属于管理端还是移动端\n2. 参考 `DESIGN.md` 了解设计规范和组件风格\n3. 参考 `references\u002F` 下的规范文件确保代码符合约定\n4. 开发完成后启动 dev server 在浏览器中验证效果\n5. 移动端修改需在 HBuilderX 中编译验证\n\n## General Review Rules\n\n### 设计优先\n- 阅读 `DESIGN.md` 了解项目设计语言\n- 管理端使用 Element Plus 原生组件，不自行造轮子\n- 移动端遵循微信小程序设计规范，毛玻璃 TabBar、自定义导航栏\n- 使用项目 CSS 自定义属性（设计令牌），不硬编码颜色值\n\n### 组件开发\n- 组件放在 `components\u002F` 目录，页面放在 `pages\u002F` 或 `views\u002F`\n- 组件 Props 使用 TypeScript interface 定义类型\n- 可复用逻辑抽取为 composable（`composables\u002F`）\n- 移动端组件使用项目已有的 base 组件（`custom-navbar`, `custom-tabbar`, `pay-password-dialog`）\n\n### 样式规范\n- 管理端：优先使用 Element Plus 栅格 + Flex 布局\n- 移动端：rpx 单位适配，`box-sizing: border-box`\n- 动画：管理端用 GSAP，移动端用 CSS keyframes\n- 预定义动画 keyframes：`fadeInUp`, `scaleIn`, `slideInRight`, `slideInLeft`, `fadeUp`, `imgPop`\n\n### 编译验证\n- 管理端：`npx vue-tsc --noEmit` 类型检查\n- 管理端：`npm run dev` 启动开发服务器验证效果\n- 移动端：HBuilderX 运行 → 微信小程序\n\n## CheckList\n\n### 新建页面\n- [ ] 管理端：`views\u002F\u003Cmodule>\u002F` 目录下创建，路由在 `router\u002Findex.ts` 注册\n- [ ] 移动端：`pages\u002F\u003Cpage-name>\u002F` 目录下创建，在 `pages.json` 注册\n- [ ] `navigationStyle: \"custom\"` 使用自定义导航栏（移动端）\n- [ ] 页面有 meta 信息（标题等）\n\n### 新建组件\n- [ ] 组件有明确的 Props 类型定义\n- [ ] 复杂组件有 Emits 类型定义\n- [ ] 组件无外部副作用（不直接操作全局 store 除非设计如此）\n- [ ] 移动端组件在需要的位置正确引入（`components\u002F` 或页面内）\n\n### 数据流\n- [ ] 页面级状态使用 Pinia store，组件级状态使用 ref\u002Freactive\n- [ ] 数据获取在 `onMounted` 或路由进入时\n- [ ] 移动端使用 `uni.setStorageSync` \u002F `uni.getStorageSync` 持久化\n- [ ] 管理端使用 `localStorage` 持久化\n\n### 错误处理\n- [ ] HTTP 请求不裸调，通过封装方法自动处理 401 刷新\n- [ ] 移动端使用 `ClassifiedError` + `handlePageError()` 统一错误处理\n- [ ] 表单提交使用防重复提交（移动端 `useSubmitLock`）\n\n### 样式\n- [ ] 使用项目 CSS 变量而非硬编码颜色\n- [ ] 响应式断点正确（管理端适配不同屏幕）\n- [ ] 移动端底部留白 `.safe-area-bottom`（适配刘海屏）\n- [ ] 动画自然流畅，duration 不超过 500ms\n","# Frontend Agent\n\n## When to use this skill\n\n**触发场景：**\n- 新建 Vue 3 页面或组件（管理端或移动端）\n- 实现 UI 设计稿 \u002F 设计还原\n- Element Plus 组件使用和布局搭建\n- uni-app 页面开发和微信小程序适配\n- 样式调整、动画实现、响应式布局\n- 前端状态管理（Pinia）和路由配置\n\n**DO NOT use when:**\n- 审查已有前端代码 → 使用 `frontend-code-reviewer`\n- 修复后端 Bug 或写后端接口 → 直接修改后端代码\n- 数据库设计或 SQL 编写 → 这是后端任务\n- 配置 CI\u002FCD 或服务器 → 这是 DevOps 任务\n- 只是修改文案或配置值 → 人工直接修改即可\n\n## How to use this skill\n\n```\n\u002Fagent:frontend-agent --task \u003C描述> --target \u003Cadmin|mobile>\n```\n\n1. 明确开发目标：新建\u002F修改哪个页面或组件，属于管理端还是移动端\n2. 参考 `DESIGN.md` 了解设计规范和组件风格\n3. 参考 `references\u002F` 下的规范文件确保代码符合约定\n4. 开发完成后启动 dev server 在浏览器中验证效果\n5. 移动端修改需在 HBuilderX 中编译验证\n\n## General Review Rules\n\n### 设计优先\n- 阅读 `DESIGN.md` 了解项目设计语言\n- 管理端使用 Element Plus 原生组件，不自行造轮子\n- 移动端遵循微信小程序设计规范，毛玻璃 TabBar、自定义导航栏\n- 使用项目 CSS 自定义属性（设计令牌），不硬编码颜色值\n\n### 组件开发\n- 组件放在 `components\u002F` 目录，页面放在 `pages\u002F` 或 `views\u002F`\n- 组件 Props 使用 TypeScript interface 定义类型\n- 可复用逻辑抽取为 composable（`composables\u002F`）\n- 移动端组件使用项目已有的 base 组件（`custom-navbar`, `custom-tabbar`, `pay-password-dialog`）\n\n### 样式规范\n- 管理端：优先使用 Element Plus 栅格 + Flex 布局\n- 移动端：rpx 单位适配，`box-sizing: border-box`\n- 动画：管理端用 GSAP，移动端用 CSS keyframes\n- 预定义动画 keyframes：`fadeInUp`, `scaleIn`, `slideInRight`, `slideInLeft`, `fadeUp`, `imgPop`\n\n### 编译验证\n- 管理端：`npx vue-tsc --noEmit` 类型检查\n- 管理端：`npm run dev` 启动开发服务器验证效果\n- 移动端：HBuilderX 运行 → 微信小程序\n\n## CheckList\n\n### 新建页面\n- [ ] 管理端：`views\u002F\u003Cmodule>\u002F` 目录下创建，路由在 `router\u002Findex.ts` 注册\n- [ ] 移动端：`pages\u002F\u003Cpage-name>\u002F` 目录下创建，在 `pages.json` 注册\n- [ ] `navigationStyle: \"custom\"` 使用自定义导航栏（移动端）\n- [ ] 页面有 meta 信息（标题等）\n\n### 新建组件\n- [ ] 组件有明确的 Props 类型定义\n- [ ] 复杂组件有 Emits 类型定义\n- [ ] 组件无外部副作用（不直接操作全局 store 除非设计如此）\n- [ ] 移动端组件在需要的位置正确引入（`components\u002F` 或页面内）\n\n### 数据流\n- [ ] 页面级状态使用 Pinia store，组件级状态使用 ref\u002Freactive\n- [ ] 数据获取在 `onMounted` 或路由进入时\n- [ ] 移动端使用 `uni.setStorageSync` \u002F `uni.getStorageSync` 持久化\n- [ ] 管理端使用 `localStorage` 持久化\n\n### 错误处理\n- [ ] HTTP 请求不裸调，通过封装方法自动处理 401 刷新\n- [ ] 移动端使用 `ClassifiedError` + `handlePageError()` 统一错误处理\n- [ ] 表单提交使用防重复提交（移动端 `useSubmitLock`）\n\n### 样式\n- [ ] 使用项目 CSS 变量而非硬编码颜色\n- [ ] 响应式断点正确（管理端适配不同屏幕）\n- [ ] 移动端底部留白 `.safe-area-bottom`（适配刘海屏）\n- [ ] 动画自然流畅，duration 不超过 500ms\n",{"name":5,"model":24,"memory":25,"description":7},"sonnet","user","main","14d19341a5ae6e5a3c751328fcc273395da5bd21",".agent\u002Ffrontend-agent","https:\u002F\u002Fgithub.com\u002FIkeu-1030\u002FiRun","https:\u002F\u002Fgithub.com\u002FIkeu-1030","Action shatters illusion\u002F","2026-07-02 15:19:58",{"source":8,"skillName":5,"commands":34,"prompt":44,"zipAvailable":45},[35,38,41],{"tool":36,"command":37},"npx","npx skills add Ikeu-1030\u002FiRun --skill frontend-agent",{"tool":39,"command":40},"bunx","bunx skills add Ikeu-1030\u002FiRun --skill frontend-agent",{"tool":42,"command":43},"pnpm","pnpm dlx skills add Ikeu-1030\u002FiRun --skill frontend-agent","安装技能，技能地址：https:\u002F\u002Fgithub.com\u002FIkeu-1030\u002FiRun\u002Fblob\u002Fmain\u002F.agent\u002Ffrontend-agent\u002FSKILL.md",true,[47,53,57],{"path":48,"resourceType":49,"resourceTypeDesc":50,"sizeBytes":51,"sourceHtmlUrl":52},"DESIGN.md","REFERENCE","参考文档",7100,"https:\u002F\u002Fgithub.com\u002FIkeu-1030\u002FiRun\u002Fblob\u002Fmain\u002F.agent\u002Ffrontend-agent\u002FDESIGN.md",{"path":54,"resourceType":49,"resourceTypeDesc":50,"sizeBytes":55,"sourceHtmlUrl":56},"references\u002Felement-plus-usage.md",3091,"https:\u002F\u002Fgithub.com\u002FIkeu-1030\u002FiRun\u002Fblob\u002Fmain\u002F.agent\u002Ffrontend-agent\u002Freferences\u002Felement-plus-usage.md",{"path":58,"resourceType":49,"resourceTypeDesc":50,"sizeBytes":59,"sourceHtmlUrl":60},"references\u002Fvue3-conventions.md",2399,"https:\u002F\u002Fgithub.com\u002FIkeu-1030\u002FiRun\u002Fblob\u002Fmain\u002F.agent\u002Ffrontend-agent\u002Freferences\u002Fvue3-conventions.md",[62,69,76,83,90,97],{"skillNo":63,"name":64,"nameZh":6,"description":65,"descriptionZh":6,"repositoryFullName":8,"ownerLogin":9,"ownerAvatarUrl":10,"ownerAccountNo":11,"ownerDisplayName":12,"repositoryNo":13,"starsCount":14,"licenseSpdxId":15,"licenseFileUrl":6,"sourceHtmlUrl":66,"categories":67,"keywords":68,"publishedAt":19},"01M756NR65N494G30JZP84MS7R","understand","Analyze a codebase to produce an interactive knowledge graph for understanding architecture, components, and relationships","https:\u002F\u002Fgithub.com\u002FIkeu-1030\u002FiRun\u002Fblob\u002Fmain\u002F.claude\u002Fskills\u002Funderstand-anything\u002Funderstand-anything-plugin\u002Fskills\u002Funderstand\u002FSKILL.md",[],[],{"skillNo":70,"name":71,"nameZh":6,"description":72,"descriptionZh":6,"repositoryFullName":8,"ownerLogin":9,"ownerAvatarUrl":10,"ownerAccountNo":11,"ownerDisplayName":12,"repositoryNo":13,"starsCount":14,"licenseSpdxId":15,"licenseFileUrl":6,"sourceHtmlUrl":73,"categories":74,"keywords":75,"publishedAt":19},"01M756NPH7BMV8655NPXER0ZAS","understand-onboard","Use when you need to generate an onboarding guide for new team members joining a project","https:\u002F\u002Fgithub.com\u002FIkeu-1030\u002FiRun\u002Fblob\u002Fmain\u002F.claude\u002Fskills\u002Funderstand-anything\u002Funderstand-anything-plugin\u002Fskills\u002Funderstand-onboard\u002FSKILL.md",[],[],{"skillNo":77,"name":78,"nameZh":6,"description":79,"descriptionZh":6,"repositoryFullName":8,"ownerLogin":9,"ownerAvatarUrl":10,"ownerAccountNo":11,"ownerDisplayName":12,"repositoryNo":13,"starsCount":14,"licenseSpdxId":15,"licenseFileUrl":6,"sourceHtmlUrl":80,"categories":81,"keywords":82,"publishedAt":19},"01M756NM7K2DP7KD475N4S3ZXD","understand-knowledge","Analyze a Karpathy-pattern LLM wiki knowledge base and generate an interactive knowledge graph with entity extraction, implicit relationships, and topic clustering.","https:\u002F\u002Fgithub.com\u002FIkeu-1030\u002FiRun\u002Fblob\u002Fmain\u002F.claude\u002Fskills\u002Funderstand-anything\u002Funderstand-anything-plugin\u002Fskills\u002Funderstand-knowledge\u002FSKILL.md",[],[],{"skillNo":84,"name":85,"nameZh":6,"description":86,"descriptionZh":6,"repositoryFullName":8,"ownerLogin":9,"ownerAvatarUrl":10,"ownerAccountNo":11,"ownerDisplayName":12,"repositoryNo":13,"starsCount":14,"licenseSpdxId":15,"licenseFileUrl":6,"sourceHtmlUrl":87,"categories":88,"keywords":89,"publishedAt":19},"01M756NJPJADZ13YRP1D9PEVEF","understand-explain","Use when you need a deep-dive explanation of a specific file, function, or module in the codebase","https:\u002F\u002Fgithub.com\u002FIkeu-1030\u002FiRun\u002Fblob\u002Fmain\u002F.claude\u002Fskills\u002Funderstand-anything\u002Funderstand-anything-plugin\u002Fskills\u002Funderstand-explain\u002FSKILL.md",[],[],{"skillNo":91,"name":92,"nameZh":6,"description":93,"descriptionZh":6,"repositoryFullName":8,"ownerLogin":9,"ownerAvatarUrl":10,"ownerAccountNo":11,"ownerDisplayName":12,"repositoryNo":13,"starsCount":14,"licenseSpdxId":15,"licenseFileUrl":6,"sourceHtmlUrl":94,"categories":95,"keywords":96,"publishedAt":19},"01M756NF79MR3DD69W7XJAT2PB","understand-domain","Extract business domain knowledge from a codebase and generate an interactive domain flow graph. Works standalone (lightweight scan) or derives from an existing \u002Funderstand knowledge graph.","https:\u002F\u002Fgithub.com\u002FIkeu-1030\u002FiRun\u002Fblob\u002Fmain\u002F.claude\u002Fskills\u002Funderstand-anything\u002Funderstand-anything-plugin\u002Fskills\u002Funderstand-domain\u002FSKILL.md",[],[],{"skillNo":98,"name":99,"nameZh":6,"description":100,"descriptionZh":6,"repositoryFullName":8,"ownerLogin":9,"ownerAvatarUrl":10,"ownerAccountNo":11,"ownerDisplayName":12,"repositoryNo":13,"starsCount":14,"licenseSpdxId":15,"licenseFileUrl":6,"sourceHtmlUrl":101,"categories":102,"keywords":103,"publishedAt":19},"01M756NCF0HHCSJTMDV85G7KR2","understand-diff","Use when you need to analyze git diffs or pull requests to understand what changed, affected components, and risks","https:\u002F\u002Fgithub.com\u002FIkeu-1030\u002FiRun\u002Fblob\u002Fmain\u002F.claude\u002Fskills\u002Funderstand-anything\u002Funderstand-anything-plugin\u002Fskills\u002Funderstand-diff\u002FSKILL.md",[],[]]