frontend-skills
为AI Agent提供前端代码编写、审查与重构的专项技能集。
安装使用
复制下面这段提示词发给你的 AI（Claude / Cursor / TRAE / Codex / WorkBuddy 等），它会自动帮你完成安装：
帮我安装这个 AI Skill：frontend-skills。 它的用途是：为AI Agent提供前端代码编写、审查与重构的专项技能集。 完整的 Skill 内容见：https://321skill.com/skills/frontend-skills/raw/index.md 请读取该页面内容，如果是 SKILL.md 格式直接安装，如果是 README 提炼核心 prompt 后安装。
提示词包含完整的 Skill 内容链接，AI 读取后即可完成安装。你也可以 查看完整内容 确认无误。
使用示例
“请帮我审查这个React函数组件的代码，看看有没有性能问题。”，它会自动调用`react-best-practices`技能，逐条比对30条规则，指出诸如不必要的重新渲染、错误的Effect依赖等问题，并提供具体的修改建议。或者
对AI说：“本地workflow-executions-api服务启动失败了，如何排查？”，它会调用`workflow-local-dev`技能，引导你使用kubectl检查Pod状态、查看相关日志，并给出常见的故障解决命令。
介绍
该技能仓库旨在解决AI Agent在处理前端代码时缺乏专业指导的问题，通过预置的React最佳实践和本地开发工作流技能，确保AI生成的代码符合高性能标准和团队协作规范。
使用方式非常简单，开发者只需在AI Agent环境中运行一条安装命令，即可将技能加载到Agent中。之后，当Agent处理相关任务时，这些技能会自动生效，提供专业建议和操作指引。
它特别适合需要AI辅助进行前端开发、代码审查或本地环境调试的开发者。无论是编写新的React组件，还是优化现有代码性能，或是排查本地开发环境中的问题，该技能都能提供即时的专业支持。
请注意，react-best-practices技能部分规则依赖于React 19.2.x及以上版本并启用React编译器，在使用前请确认项目环境。而workflow-local-dev技能则紧密绑定特定的DAP工作空间和Kubernetes（Kind）环境，在其他开发栈中可能不完全适用。
核心特点
与通用前端指南不同，`react-best-practices`技能直接源自Vercel Labs的优化实践，并专门针对React 19进行了精简和适配，提供了30条按优先级排序的具体规则。`workflow-local-dev`技能则深度集成了特定工作空间的完整本地开发、测试和调试流程，提供了从命令到脚本的一站式解决方案。
注意事项
`workflow-local-dev`技能高度依赖特定的DAP工作空间和Kubernetes（Kind）环境，不适合通用前端项目的本地开发。
常见问题
这个技能包会影响AI的响应速度吗？
通常不会，技能在安装后作为知识背景存在，仅在处理相关任务时被激活调用，对常规对话速度影响微乎其微。
我可以只安装其中一个技能吗？
目前仓库设计为整体安装，两个技能会一同加载。您可以在与AI交互时，通过明确的任务指令来引导其使用特定的技能。
给 AI 助手的安装指引
如果你的 AI 编程助手（Claude Code、Cursor、TRAE 等）能看到这个页面，把下面这段发给它即可自动完成安装：
请访问 https://321skill.com/skills/frontend-skills/raw/index.md 读取 frontend-skills 的原始 Skill 定义（Markdown 格式），按其中说明在我的环境里完成安装和配置。
AI 可直接读取的原始 Markdown 地址：/skills/frontend-skills/raw/index.md（查看排版版本）