OpenClaw AI 技能

提供 React 架构模式、TypeScript、Next.js、hooks 以及测试指导。适用于 React 组件结构、状态管理、Next.js 路由、Vite 等开发场景。

Vercel 工程团队出品的 React 和 Next.js 性能优化指南，涵盖 8 个分类的 57 条规则，用于编写、审查和重构 React 代码，提高开发效率和代码质量。

一套可扩展的 React 组合模式，适用于解决组件布尔属性泛滥问题、构建灵活的组件库、设计可重用 API。触发场景包括复合组件、渲染 props、上下文提供者或组件架构设计。包含 React 19 API 更新。

提供 React 和 Next.js 性能优化模式，适用于编写、审查或重构 React/Next.js 代码以确保最佳性能。触发条件包括涉及组件、数据获取、捆绑包优化、重新渲染减少或服务器组件架构的任务。

为 React 应用提供实时数据支持，集成 SSE、WebSocket 和 SWR。涵盖连接管理、重连逻辑和乐观更新，适用于构建实时功能的 React 应用。

AntV S2 表格渲染千万级数据，支持透视、明细表、多维分析，提供性能优化和 Vue3 集成方案。

生成完整的男装电商系统项目，技术栈为 SpringBoot3 + Vue3 + MySQL。执行流程：先输出详细技术方案供用户确认，确认后再分模块生成完整的前后端代码。使用场景：当用户需要创建一个完整的男装电商平台，包括商品管理、用户管理、订单管理、购物车、支付集成等功能时使用此技能。

来自 ui.inference.sh 的 React/Next.js 聊天界面构建块，包括容器、消息、输入框、打字指示器和头像等组件，提供完整的聊天界面功能。

构建使用 Vue 3 的服务器端渲染（SSR）和静态站点生成（SSG）应用，提供适当的数据获取、hydration 和服务器模式。

部署 Next.js 网站到 Netlify，支持审批流。支持 soilrichbyjohn.com 和 Synergy 美容沙龙网站的部署。

用于构建基于 Shadcn/UI 组件、Tailwind CSS 布局、react-hook-form 和 Zod 表单模式、主题化、暗模式、侧边栏布局、移动端支持等 UI 项目

前端设计质量提升 skill。让 AI 生成的 UI/前端代码更专业，避免常见设计反模式。参考 impeccable 项目的设计语言规范，提供 audit/polish/critique 等设计审查命令。触发词：/audit /polish /critique /colorize /animate

Aoleme UI 能够生成独特的黑暗霓虹赛博仙侠风格的仪表盘、具有玻璃般透明效果的界面，以及将游戏元素融入的 React 和 Tailwind CSS UI 组件。该工具适合开发者快速创建具有未来感和互动性的网页界面。

Tailwind CSS 框架的参考工具，适用于前端开发中使用 Tailwind 时的快速查询和参考。

使用 React（Vite + TypeScript + Tailwind CSS 4）从客户参考材料（标志、图像、演示等）创建专业的机构网站。

使用 React、Tailwind CSS 和 shadcn/ui 创建独特的生产级静态网站，无需模拟。从简单文本生成大胆、易记的设计。