component-design-best-practice

Must follow when 设计或审查 React 组件，确保组件符合 shadcn/ui 设计哲学：单一职责、可组合、可访问、可复制粘贴。定义何时应该拆分组件、组件边界、命名规范。

Opciones de instalación

De forma predeterminada está seleccionado el prompt que primero revisa el origen. Puedes cambiar a un comando directo o descargar una copia local.

Instalar con Codex o Claude Copia este prompt, pégalo en Codex, Claude u otro asistente, y deja que revise la página de la skill y la instale por ti.

Un comando directo omite el prompt de revisión. Revisa el origen antes de ejecutarlo.

npx skills add https://github.com/forge-town/skills --skill component-design-best-practice

El comando permanece en una sola línea. Desplázate horizontalmente para revisarlo antes de copiarlo.

¿Prefieres una copia local? Descarga los archivos que SkillsMP tiene disponibles ahora.

Lee SKILL.md y los archivos complementarios que muestra SkillsMP antes de decidir si quieres instalarlo.

Explorador de archivos

5 archivos

SKILL.md

Instrucciones de origen · Vista previa de solo lectura

Must follow when 创建或重构前端表单组件，确保表单结构、字段验证逻辑和状态管理遵循项目表单设计规范与组件化标准。

Must follow when 使用 Zustand 创建或重构状态管理 Store，确保遵循 slice 模式、Provider 设置和类型安全规范。

Use when 需要评估现有 checklist 的脚本化可能性，分析哪些检查项可通过代码自动化，哪些必须依赖 LLM 判断，输出明确的脚本化设计方案和实现指南。触发词：规划检查脚本、评估脚本化、设计自动化检查、checklist转脚本。

name	component-design-best-practice
description	Must follow when 设计或审查 React 组件，确保组件符合 shadcn/ui 设计哲学：单一职责、可组合、可访问、可复制粘贴。定义何时应该拆分组件、组件边界、命名规范。