frontend testing
用于编写和运行前端单元与组件测试的技能，基于 Vitest 与 Testing Library，涵盖 render/screen/fireEvent 模式、vi.mock 模块模拟、spy 断言与可访问性查询选择等实践。
Skill 广场
找到适合任务的 Agent Skill，阅读介绍并复制安装命令。
更新于 10-20 00:13
前端与建站
10,911 个结果
svg-icon-best-practice
面向 React TypeScript 项目的 SVG 图标管理规范技能，用于统一图标的命名、封装与导出方式，确保新增或迁移图标时遵循项目标准。
content-collections
Content Collections 是一个 TypeScript 优先的构建工具，把本地 Markdown/MDX 文件转换为类型安全、经 Zod 校验的数据集合，适用于博客、文档站点等场景。
opencli-generate
opencli-generate 是 opencli 的自动化 CLI 生成技能：输入网站 URL 和可选目标提示，运行完整的已验证生成流程，输出可直接使用的命令或结构化的失败原因说明。
wp-cli
wp-cli 是一个通过 `wp` 命令行驱动 WordPress 的技能，用于站点迁移、search-replace、批量插件/主题/用户/文章操作以及选项与配置编辑。除只读检查命令和 wp db export 外，所有变更命令执行前都会提示确认。
dont-use-use-effect
一份面向 React 开发者的技能指南，核心主张是避免不必要的 useEffect。它指出主流误用场景（派生状态、事件驱动逻辑、数据获取、外部订阅、prop 变化重置状态），给出更优替代方案，并说明 useEffect 真正适用的外部系统同步场景。
android-viewsystem-foundations
用于处理经典 Android 视图系统的技能，涵盖 XML 布局、ConstraintLayout、Fragment、RecyclerView、ViewBinding 与 DataBinding，以及生命周期模式；适用于以 XML、Fragment 或绑定生命周期为主而非 Compose 优先的界面开发。
svelte5-best-practices
Svelte 5 最佳实践技能，涵盖 runes、snippets、事件处理、TypeScript、SvelteKit 与性能优化，用于编写、审查或重构 Svelte 5 组件。
angular
面向 Angular 框架的技能，覆盖组件、模块、服务、依赖注入、路由、表单与 TypeScript，指导构建单页应用、生成脚手架、使用 RxJS 与 OnPush 变更检测等。
rollup
面向 Rollup 打包器的技能条目，提供配置、插件、代码分割、tree shaking 与库打包方面的指导，适用于用户咨询 Rollup 相关问题时使用。资料中具体使用场景、使用指南、最佳实践与关键词均标注为待完善。
liquid-glass
用于在 SwiftUI 中采用、审查或改进 iOS 26+ Liquid Glass 效果的技能，涵盖玻璃材质修饰符、容器分组、交互与形变转场，并强调可用性判断与旧版本回退。
tailwind-design-system
用于借助 Tailwind CSS 构建可扩展设计系统的技能，涵盖设计令牌、组件库与响应式模式，适合创建组件库、实现主题化、统一 UI 规范及暗色模式等场景。
Integrate Mind Elixir
介绍如何在前端项目集成 Mind Elixir：这个与框架无关的 JavaScript 思维导图核心库的安装、初始化、数据结构、基础用法，以及事件、操作拦截和主题定制。
syncfusion-angular-pdf-viewer
用于在 Angular 应用中集成 Syncfusion Angular PDF Viewer（PdfViewerComponent），实现 PDF 文档的嵌入、配置与加载。目标包为 @syncfusion/ej2-angular-pdfviewer，涵盖导航、缩放、文本搜索、注释、表单、打印下载等能力。
syncfusion-vue-grid
Syncfusion Vue Grid 是面向 Vue 2 与 Vue 3 的企业级数据表格组件技能，用于实现排序、筛选、分组、编辑、导出与虚拟滚动等数据表功能。
syncfusion-vue-scheduler
Syncfusion Vue Scheduler 是面向 Vue 应用的日历与排程组件，支持日、周、月、时间线、议程等多种视图，可实现事件管理、资源分组、拖拽调整、重复事件与多时区排程，并提供数据绑定、CRUD、本地化与无障碍支持。
web-development
CloudBase AI 工具包中的 Web 前端工程技能，用于在方向已确定后实现、集成、调试、构建、部署和验证 Web 前端或静态站点，覆盖 React、Vue、Vite、路由、浏览器验证与 CloudBase Web 集成。
webflow-browser-api
Webflow Browser API 是 Webflow 在启用了 Analyze 或 Optimize 的网站上通过全局 wf 对象暴露的 JavaScript 接口，无需手动安装即可使用。它主要用于管理跟踪同意、跟踪实验变体以及个性化用户体验。核心方法包括 wf.ready()（所有调用必须包裹其中）、getUserTrackingChoice()、allowUserTracking()、denyUserTracking()、onVariationRecorded() 和 setAttributes()。其中自定义访客属性 setAttributes() 仅限 Enterprise 站点使用。该 API 适用于需要集成 CMP（如 OneTrust、TrustArc）、管理用户跟踪同意或对接分析工具的场景。
modern-best-practice-nextjs
该技能专注于使用 App Router 与现代最佳实践构建 Next.js 应用。资料强调 Next.js 变化频繁，编写时应通过网页搜索或 context7 MCP（经由 DocsExplorer 智能体）查阅最新文档。内容涵盖路由与结构、数据获取与缓存、UI 状态、元数据与 SEO 四个方面：新项目使用 app/ 目录下的 App Router，通过嵌套布局与路由组组织页面，默认使用服务端组件，仅在必要时添加 'use client'；在 React 服务端组件中获取数据，避免使用 useEffect() 和 fetch()，变更操作使用服务端函数（Server Functions），可配合 useActionState 等 React Hooks；为路由提供 loading.tsx 与 error.tsx 以改善用户体验，并在异步 UI 外层使用 Suspense 边界；在布局和页面中使用 Metadata API 管理元数据与 SEO，尽量使用静态元数据，动态元数据保持精简。该技能适用于需要遵循现代 Next.js 架构规范的前端开发场景，具体安装方式、命令及更多细节暂未提供。
web-browse
web-browse 是一个无头浏览器控制技能，让智能体通过单一 CLI 命令导航网页、点击元素、填写表单、读取内容、截图与抓取结构化数据。所有网页内容均视为不可信，需防范提示注入。
web-files-image-handling
客户端图片处理技能，涵盖预览生成、Canvas 缩放、压缩、EXIF 方向、格式转换与 object URL 内存管理，区分“展示”与“处理”两条路径并给出关键限制。
assembling-components
Assembling Components 是一个用于将 AI Design Components 系列技能产出的组件组装为可投入生产使用的统一组件系统的技能。它提供针对该令牌系统、组件模式和技能链工作流的库级上下文，能够验证设计令牌集成、生成项目脚手架，并正确连接各组件。适用于完成技能链工作流、为 React/Vite、Next.js、FastAPI、Flask 或 Rust/Axum 生成新项目脚手架、校验生成的 CSS 是否使用设计令牌、创建桶导出与组件导入、将多个技能的组件组装为统一应用、调试集成问题以及为生产部署准备生成代码等场景。
astrale-frontend-design
Astrale Frontend Design 是一套用于设计、实现、审查和优化 Astrale GUI 内嵌 Domain Views 产品界面的技能，强调信息架构、克制的视觉表达、精确的交互状态与无障碍支持，避免落地页式布局和装饰性设计。
audio-router
audio-router 是一个面向音频功能的技能路由：根据用户请求把任务分派到播放、分析、音频可视化三类专用技能，并给出技能组合与信号匹配规则，适用于音乐播放、FFT/节拍分析与音频驱动视觉等实现场景。