AgentSkillsCN

react-component-gen

生成新的 React 组件,并自动生成对应的 Vitest 单元测试文件。当您需要创建全新的 UI 组件时,可使用此功能。

SKILL.md
--- frontmatter
name: react-component-gen
description: Generates a new React component with a corresponding Vitest unit test file. Use this when you need to create a new UI component.

React Component Generator

This skill automates the creation of a React component and its test file, ensuring consistency and test coverage.

Usage

To generate a component, run the generate_component.cjs script with the component name.

bash
node .gemini/skills/react-component-gen/scripts/generate_component.cjs <ComponentName>

You can also specify a path relative to components/ (e.g., forms/TextInput).

What it does

  1. Creates <ComponentName>.tsx in components/ (or specified subdirectory).
  2. Creates <ComponentName>.test.tsx in the same directory.
  3. Includes basic boilerplate code and a smoke test.