implement-hotwire
面向 Rails 前端的 Hotwire 实现技能，用于添加 Turbo Frames、Turbo Streams 或 Stimulus 控制器。强调渐进增强：先写纯 HTML，再逐步叠加 Hotwire，并先在不启用 JavaScript 的情况下测试。
Skill 广场
找到适合任务的 Agent Skill，阅读介绍并复制安装命令。
更新于 10-22 00:14
前端与建站
10,981 个结果
pb-react-spa
用于搭建与 PocketBase 后端集成的 React SPA 前端的技能，基于 Vite、TanStack Router、TanStack Query、Tailwind CSS/Shadcn UI 与 Biome，并包含类型生成、认证与部署指引。
frontend-core-architecture
一个与框架无关的前端核心架构技能，把 Web 平台拆成标记、样式、行为、动画/时间线四层，规定规范查阅顺序，并将 CSS 与 DOM 操作映射到浏览器渲染管线，同时给出何时需要构建步骤的判断规则。
frontend-dev-guidelines
该技能是一套面向 React/TypeScript 应用的前端开发规范指南，强调基于 Suspense 的数据获取、懒加载、文件组织与性能优化。内容涵盖组件模式、数据获取、文件组织、样式、路由、加载与错误状态、性能、TypeScript 规范、常见模式及完整示例等主题，并提供新建组件、新建功能的检查清单、导入别名速查（@/、~types、~components、~features）与常见导入代码片段。主要推荐使用 useSuspenseQuery、TanStack Query、TanStack Router、MUI v7、SuspenseLoader、useMuiSnackbar 等约定，并规定避免提前返回加载动画、重组件懒加载、按代码行数决定样式内联或拆分、使用 import type 等要求。适用于创建组件或页面、构建新功能、使用 TanStack Query 获取数据、设置 TanStack Router 路由、使用 MUI v7 设置样式、性能优化、组织前端代码及遵循 TypeScript 最佳实践等场景。
web-frameworks
Web Frameworks 技能组是一套面向现代全栈 Web 应用开发的综合指南，整合 Next.js、Turborepo 与 RemixIcon 三个工具。Next.js 提供 App Router、Server Components（RSC）、PPR、SSR、SSG、ISR 等渲染与优化能力；Turborepo 负责 monorepo 管理与任务流水线、缓存；RemixIcon 提供 3100+ 线性与填充风格图标。技能组给出单应用与 monorepo 两种技术栈选型、快速开始命令、共享组件库与数据获取等常见模式、CI/CD 配置示例，以及 Python 辅助脚本和最佳实践清单，适合构建电商、营销站、SaaS、文档站、多应用平台等场景。
backstage-style-web
基于 Backstage Design System 生成企业级 Web 应用的技能，使用 React 18+ 与 TypeScript，适合构建管理后台、开发者工具、内部应用和数据管理界面，支持明暗主题、响应式布局与无障碍设计。
nuxt
Nuxt 是基于 Vue 的全栈框架，提供 SSR、文件路由、自动导入与模块系统，以 Nitro 为服务端引擎支持 Node.js、无服务器与边缘平台部署。该资料基于 Nuxt 5.x，介绍目录结构、配置、路由、数据获取、服务端路由、渲染模式与模块等内容。
pinia
Pinia 是 Vue 官方状态管理库，类型安全且可扩展，支持 Options API 与 Composition API，提供完善的 TypeScript 支持和 devtools 集成。适用于定义 store、处理 state/getters/actions，以及在组件外使用 store 等场景。
unocss
UnoCSS 是一个即时原子化 CSS 引擎，作为 Tailwind CSS 的超集，核心不预设观点，所有 CSS 工具类通过预设提供。基于 v66.10.5，涵盖配置、规则、快捷方式、主题、变体、提取及多种预设与集成。
vitepress
VitePress 是基于 Vite 与 Vue 3 的静态站点生成器，把 Markdown 加主题生成静态 HTML，并作为 SPA 提供快速导航，适合文档站、博客与营销站点。
vue
基于 Vue 3.5 的 Vue 技能，聚焦 Composition API、script setup 宏、响应式系统与内置组件，用于编写 Vue 单文件组件及 defineProps、defineEmits、defineModel 等场景。
vue-best-practices
该技能是一套面向 Vue.js 任务的开发规范与工作流指令集，强调以 Vue 3、Composition API、`<script setup>` 和 TypeScript 作为标准方案，并覆盖 Vue 3、SSR、Volar 等内容。它要求在编码前先确认架构、规划组件边界，并阅读响应性、单文件组件（SFC）、组件数据流和组合式函数（composables）等核心参考资料。核心原则包括：保持状态可预测（单一数据源，其余尽量派生）、让数据流显式（多数情况下 Props 向下、Events 向上）、倾向小而专注的组件、避免不必要的重新渲染、重视可读性。工作流还规定了 SFC 结构顺序、模板安全规则、组件拆分触发条件、props/emits 类型契约、可选特性（插槽、Teleport、Suspense、Transition 等）按需启用，以及先保证行为正确再做事后性能优化的顺序。
vue-debug-guides
面向 Vue 3 的调试与错误处理技能，覆盖运行时错误、警告、异步失败与 SSR/水合问题，按响应式、组件、模板、生命周期、插槽、组合式 API、TypeScript、性能等主题给出排查指引。
vue-jsx-best-practices
面向 Vue 的 JSX 语法实践技能，说明 Vue JSX 与 React JSX 的差异，例如 class 与 className 的写法区别以及 JSX 插件配置，适合从 React 迁移到 Vue 或遇到属性类型报错的场景。
vue-pinia-best-practices
面向 Vue 项目的 Pinia 状态管理最佳实践技能，汇总 store 初始化、响应式与状态模式中的常见坑，并指向对应子技能文档，帮助排查 getActivePinia 报错、解构失去响应式、方法上下文丢失等问题。
vue-router-best-practices
Vue Router 4 最佳实践技能，涵盖导航守卫、路由参数与路由组件生命周期交互，汇总常见陷阱与导航模式，如参数变化不触发生命周期、beforeRouteEnter 中无法访问 this、守卫异步未 await、无限重定向循环及已废弃的 next() 用法等。
vue-testing-best-practices
Vue.js 测试最佳实践技能，覆盖 Vitest、Vue Test Utils、组件测试、mock 与 Playwright 端到端测试，针对测试常见陷阱给出对应参考章节。
react-ui-patterns
react-ui-patterns 是一套面向现代 React 应用的 UI 模式指南，聚焦加载状态、错误处理与数据获取三类常见场景。它强调几条核心原则：只在真正加载且无数据时才显示加载指示，不展示过期 UI；错误必须对用户可见；采用乐观更新让界面响应更迅速；渐进式披露内容；部分数据优于无数据。内容涵盖加载状态决策树、骨架屏与加载指示器的选择标准（已知内容形状用骨架屏，未知用加载指示器）、错误处理层级（字段级内联错误、可恢复的 Toast 提示、页面级错误横幅、不可恢复的全屏错误页）、按钮加载与禁用模式、空状态要求（每个列表都必须有空状态，并区分搜索无结果与列表无数据）、表单提交流程，以及常见反模式与组件检查清单。适用于构建 UI 组件、处理异步数据或管理 UI 状态的场景。
hwc-stimulus-fundamentals
Stimulus 控制器基础技能，讲解生命周期钩子、values 与 valueChanged 回调、targets 与 target 回调、outlets、action 参数和键盘事件等核心用法，帮助编写状态边界清晰、可组合的 Stimulus 控制器。
kf-g-css-spacing-gap-margin-rules
用于设计、审查或生成 CSS 间距规则的技能：主张把间距职责交还容器，规则间距用 gap，结构性留白用空网格单元，margin 仅作例外。
mobile-onboarding
这是一个用于展示 App 引导流程的三屏并排界面模板，属于 HTML 生成技能集合中的模板。该模板旨在并排呈现移动端 onboarding 的三个关键页面：第一屏为 Splash 启动页，包含 logo 与 tagline；第二屏为价值主张页，包含插画、一句文案与圆点指示器；第三屏为登录页，包含邮箱、Apple、Google 登录方式以及主行动按钮。适合在产品介绍、设计稿演示或引导流程预览中，一次性清晰地对比三个核心引导屏的布局与内容结构。
pricing-page
一个标准 SaaS 三档定价页模板，包含月付/年付切换、Free/Pro/Enterprise 三档卡片、特性对比表与 FAQ，用于快速搭建定价页面。
html-deck
html-deck 是一个把笔记、文章、调研资料、会议记录、URL 或口头委托整理成 HTML 演示文稿的技能。它在固定 1600x900 画布上实测检查版面，支持图、SVG 和 draw.io 图表，并通过评价子代理的反复退回循环打磨到可读水平。
improve-codebase-architecture
扫描代码库中可深化模块的架构改进机会，生成可视化 HTML 报告，再针对所选候选方案进行深入探讨。