Storybook Scaffolder Workflow (v2)
- Get component path.
- Generate
.stories.tsxfile from template. - Prepend this line to the top of the generated file:
import 'src/styles/design-tokens.css'; - Report success.
Storybook Scaffolder
Generates a Storybook story file (*.stories.tsx) with M3 design token imports and interactive variant stories. Use when documenting React components for development and QA testing.
majiayu000
Updated Storybook Scaffolder by majiayu000 · eb1b8da
npx skillmds@latest add majiayu000/storybook-scaffolder File contents
---name: storybook-scaffolderdescription: Generates a Storybook story file (*.stories.tsx) with M3 design token imports and interactive variant stories. Use when documenting React components for development and QA testing.---# Storybook Scaffolder Workflow (v2)1. Get component path.2. Generate `.stories.tsx` file from template.3. **Prepend this line to the top of the generated file:** `import 'src/styles/design-tokens.css';`4. Report success.
majiayu000/claude-skill-registry-data/tree/main/development/storybook-scaffolder commit eb1b8da7a9
Frequently asked questions
Run npx skillmds@latest add majiayu000/storybook-scaffolder 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.
Generates a Storybook story file (*.stories.tsx) with M3 design token imports and interactive variant stories. Use when documenting React components for development and QA testing. It is listed under Web & Frontend on SkillMD.
This skill has not completed SkillMD's automated safety review yet. Capability flags: docs only. 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.
majiayu000 (@majiayu000) published this skill. Their other Agent Skills are listed on their SkillMD profile.