AgentSkillsCN

frontend-component

按照项目规范创建 React 组件。

SKILL.md
--- frontmatter
name: frontend-component
description: Create React components following project standards.

Component Creation

Use Generator Scripts

bash
./scripts/generate-component.sh MyButton              # → shared/
./scripts/generate-component.sh ClusterCard clustering # → clustering/
./scripts/generate-hook.sh useTheme

Location Rules

TypePath
Reusablecomponents/shared/
Feature-specificcomponents/[feature]/
Sub-componentscomponents/[feature]/components/

Standards

  • •Tailwind CSS with slate (bg/text) + sky (accents)
  • •Icons from lucide-react
  • •Wrap in memo() for lists/visualizations
  • •Always accept className prop
  • •Use @/ alias for imports