用于创建、配置、审查或调试基于 Vite 的前端项目、vite.config.ts、环境变量、dev server proxy、HMR、插件顺序、library mode、依赖预打包、bundle splitting 或 Vite 构建性能。React/Vue 组件架构请使用框架专项 skill；中文触发词包括 Vite 配置、vite.config、Vite 构建、Vite 性能。
한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.
用于运行现有项目验证命令并修复代码变更后的失败，包括 lint、type-check、单元/集成测试、build、CI 或本地脚本失败。不要用于设计或编写新的组件/E2E 测试；中文触发词包括 验证、检查失败、修复失败、CI 失败。
한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.
用于将文章、演讲稿、课程、产品演示或口播解释转成可录制的 16:9 网页演示，包含步骤驱动场景、可选口播对齐、主题 Token 与录屏指导；中文触发词包括 网页视频、动态演示、口播稿转视频、可录屏演示、16:9 演示。
한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.
用于设计、实现或审查 Tailwind CSS 设计系统、Token 映射、主题扩展、工具类治理、组件变体、暗色模式、响应式工具、safelist 或可维护的 class 组合；中文触发词包括 Tailwind、设计 Token、组件变体、暗色模式、class 管理。
한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.
用于实现新前端行为、修复 bug 或重构可先由测试描述预期行为的逻辑。适用于组件、hooks/composables、工具函数、API clients、路由守卫或用户工作流；中文触发词包括 TDD、测试驱动、先写测试、红绿重构、回归测试。
한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.
用于设置或审查 Storybook 组件文档、设计系统展示、隔离组件状态预览、stories、addons、decorators、MDX 文档、组件状态交互检查、视觉基线或 Chromatic。真实浏览器跨页面旅程或更广覆盖规划优先选择对应测试工作流；中文触发词包括 Storybook、组件文档、Design System、视觉回归。
한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.
用于创建、配置、审查或调试前端应用、库、SDK、CLI、monorepo 包中的 TypeScript 项目规范，包括 tsconfig、strictness、module/moduleResolution、路径别名、project references、声明文件、package exports、公共 API 类型、DTO、高级泛型、判别联合、类型守卫、类型收窄或类型级回归。React/Vue/Next/Nuxt 组件架构优先使用框架项目 skill；中文触发词包括 TypeScript 项目规范、TS 项目规范、TypeScript 类型安全、类型建模、泛型、判别联合、类型收窄、tsconfig、声明文件。
한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.
用于设计或审查 Vue 3 + TypeScript 项目结构、SFC/组件边界、composables 组织、路由组合、Pinia 归属、API/错误/样式默认约定、directives 或仓库级 Vue 规范。表单、数据获取、测试、无障碍、虚拟列表、动画或安全深挖优先使用更窄的 skill；中文触发词包括 Vue 3 项目规范、Vue 组件架构。
한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.
用于将昂贵的浏览器工作移出主线程，涉及 Web Workers、SharedWorker、worker 池、Comlink、transferable objects、Vite/Webpack worker 集成或 UI 响应性修复。不要用于轻量同步工作或 DOM 操作；中文触发词包括 Web Worker、后台线程、主线程阻塞。
한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.
用于规划或审查前端测试策略，按风险选择正确测试层级，将覆盖映射到静态检查、单元测试、组件测试、集成测试、E2E、Storybook/视觉回归、a11y、安全、性能或 CI gates。不要用于编写单个组件/E2E 测试或只是运行现有验证命令；中文触发词包括 测试策略、测试分层、测试计划、覆盖矩阵。
한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.
用于构建、审查或改进需要产品专属设计方向的前端 UI，包括设计系统生成、Master/Page 覆盖、独特视觉识别、反通用界面选择、首屏层级、UI 打磨、图表 UX、交互状态、响应式行为或视觉 QA。外部设计文件为权威时，应从该来源实现，而不是自行发明方向；中文触发词包括 UI 设计、设计系统、视觉风格、不要模板化、高级感、界面打磨、交互状态。
한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.
用于实现或审查 SVG 动画、路径绘制、图标动效、Logo 动画、插画动效、微交互、CSS/SMIL/Framer Motion/GSAP 选型、动效无障碍或降级行为；中文触发词包括 SVG 动画、路径描边、动效。
한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.
用于用户要求通用前端代码评审、PR 评审、合并就绪评估、架构可维护性、类型安全、渲染/状态风险、样式一致性、可测性缺口或横向评审总结时。深度安全、无障碍、E2E 或性能问题应委托对应专项 skill；中文触发词包括 代码审查、代码评审、review。
한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.
Use when turning an article, talk script, lesson, product demo, or narrated explanation into a recordable 16:9 web presentation with step-driven scenes, optional narration alignment, theme tokens, and screen-recording guidance; Chinese triggers include web video, dynamic demonstration, spoken script to video, screen-recordable demonstration, 16:9 demonstration.
한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.
用于根据 package.json、lockfile、配置、env 示例、路由、API client 或 server routes、schema、组件、测试、CI、构建/部署配置、ADR、changelog 或迁移说明等事实源同步前端项目文档。不要用于单纯润色普通文案；中文触发词包括 文档同步、更新 README、docs sync、环境变量文档、命令清单、API 文档同步。
한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.
用于创建带 draw.io / diagrams.net 源文件的可编辑技术图，包括架构图、ERD、UML、序列图、流程图、ML 模型图、官方形状检索、品牌符号、Graphviz 自动布局、代码结构图、.drawio 校验或 draw.io CLI 导出兜底。不要用于普通位图生成、手绘草图、交互式 Canvas/Three.js 场景或装饰性 SVG 动画；中文触发词包括 draw.io、diagrams.net、可编辑架构图、.drawio、ER 图、UML、序列图、自动布局、形状检索、代码结构图。
한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.
用于生成或编辑图表、图形资产、海报、UI 样机、产品图、信息图、学术图、漫画、头像、分镜、品牌板或图像编辑工作流，尤其是导出 PNG 需要视觉质检和有限自动修复时。文字密集图表优先使用确定性的 Mermaid/SVG/HTML/canvas 源；浏览器可打开的技术图优先使用 HTML technical diagrams，覆盖系统蓝图、架构图、部署拓扑、Agent runtime、memory flow、before-after architecture、流程、序列、数据流、生命周期、runbook、PII/数据血缘和状态机；不要用于不涉及生成图像的普通 UI 打磨。中文触发词包括 图片生成、图像编辑、图表生成、架构图、系统蓝图、部署拓扑、Agent runtime、memory flow、before-after architecture、工作流图、数据流、生命周期图、状态机、ER 图、UML、序列图、海报、UI 样机、产品图、信息图、学术图、漫画、头像、分镜、品牌板、PNG 自检、自动修复。
한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.
用于编写或审查靠近 UI 代码的前端单元、组件或轻量集成测试，包括 React Testing Library、Vue Test Utils、hooks/composables、props/emits、回调、可访问查询、user-event 交互、mock、loading/error/empty 状态和回归覆盖。若是测试分层规划、真实浏览器旅程或现有验证失败，优先选择对应测试或验证工作流；中文触发词包括 组件测试、组件单测、单元测试、轻量集成测试。
한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.
用于设计、实现或审查前后端 API 集成、类型化 API client、REST/tRPC/OpenAPI 客户端选型、认证刷新、API 错误映射、上传流程、SSE/WebSocket/轮询选择、CORS 相关前端行为或跨边界 loading/error 状态。不要用于纯后端服务架构或仅 TanStack Query 缓存策略；中文触发词包括 API 集成、前后端联调、typed API client、接口错误处理、SSE、WebSocket。
한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.
保持行为的前端重构主要涉及函数类重构，已经选定或正在评估对应手法，需要查询该 family 的操作步骤、风险与 JavaScript/TypeScript/React/Vue 适配时。
한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.
保持行为的前端重构主要涉及搬移特性类重构，已经选定或正在评估对应手法，需要查询该 family 的操作步骤、风险与 JavaScript/TypeScript/React/Vue 适配时。
한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.
需要在不修改业务代码的前提下诊断既有前端代码的结构性可维护性问题，并要求提供证据、误判检查与候选重构方向时。
한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.
用于选择、实现、审查或重构 React、Vue、Next.js、Nuxt、URL 状态、服务端状态、表单状态、浏览器持久化或全局 store 的前端状态归属。TanStack Query 缓存细节、浏览器存储持久化或表单校验内部问题优先使用更窄的 skill；中文触发词包括 状态管理、状态归属、store 选型。
한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.
用于前端工作需要向后端团队说明数据、动作、状态、权限、校验或业务规则需求，但不指定端点设计、字段名、数据库形态或实现细节；中文触发词包括 前后端需求交接、后端需求、API 需求澄清、数据需求说明。
한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.