forge-town 组件设计最佳实践
使用说明
- 阅读 组件设计哲学，理解 shadcn/ui 的核心原则
- 参考 组件边界指南，掌握何时应该创建新组件
- 使用 检查清单 验证组件设计
- 查看 最佳实践示例 了解标准写法
核心原则： 组件应该是可预测的、可组合的、有单一职责的构建块
Forge Component Design Best Practice
Must follow when 设计或审查 React 组件，确保组件符合 shadcn/ui 设计哲学：单一职责、可组合、可访问、可复制粘贴。定义何时应该拆分组件、组件边界、命名规范。
Forge Component Design Best Practice by forge-town · e4574f5
npx skillmds@latest add forge-town/forge-component-design-best-practice File contents
---name: forge-component-design-best-practicedescription: Must follow when 设计或审查 React 组件，确保组件符合 shadcn/ui 设计哲学：单一职责、可组合、可访问、可复制粘贴。定义何时应该拆分组件、组件边界、命名规范。---# 组件设计最佳实践## 使用说明1. 阅读 [组件设计哲学](references/philosophy.md)，理解 shadcn/ui 的核心原则2. 参考 [组件边界指南](references/standard.md)，掌握何时应该创建新组件3. 使用 [检查清单](references/checklist.md) 验证组件设计4. 查看 [最佳实践示例](references/best-practice-examples/) 了解标准写法**核心原则：** 组件应该是可预测的、可组合的、有单一职责的构建块
forge-town/skills/tree/main/skills/forge_component-design-best-practice commit e4574f56ae
Frequently asked questions
Run npx skillmds@latest add forge-town/forge-component-design-best-practice in your terminal (requires Node.js), paste this page's agent-chat prompt into Claude, Cursor, or any MCP-connected agent, or download the SKILL.md file and copy it into your agent's skills directory.
Must follow when 设计或审查 React 组件，确保组件符合 shadcn/ui 设计哲学：单一职责、可组合、可访问、可复制粘贴。定义何时应该拆分组件、组件边界、命名规范。 It is listed under Web & Frontend on SkillMD.
This skill has not completed SkillMD's automated safety review yet. SkillMD never runs a skill's scripts for you; review the SKILL.md before installing.
This skill is tagged as working with Claude Code, Claude.ai, OpenAI Codex. SKILL.md is an open format, so most agents that read a skills directory can load it too.
Yes. Installing skills from SkillMD is free, and the skill stays under its author's original license.
forge-town (@forge-town) published this skill. Their other Agent Skills are listed on their SkillMD profile.