Set up a working preview file and stories, examples showing real components, in an existing Storybook project. Check the installed version first, then follow the setup instructions produced by Storybook’s command.
Use this skill when Storybook is already installed and the user wants a working `preview` file and stories for real components.
This skill prepares a working preview file and stories that display real components in a project where Storybook is already installed. Stories provide examples of how a component appears. It first checks package.json and .storybook/ to confirm the installation, then verifies that the version is supported before proceeding with setup.
Use it when Storybook is installed but still needs preparation to work with your actual components. It covers setting up the preview file and component stories, as well as checking the version requirements before starting that work.
Storybook 11.0 or later is required; 11.0 prereleases and canary builds also qualify. If Storybook is missing, switch to $storybook:init. For an older version or an installation needing repair, switch to $storybook:upgrade. Run npx storybook skills setup from the project root, or from the Storybook package in a monorepo, and follow the instructions it prints.
This overview was written by AI (OpenAI Codex) from the public SKILL.md. Check the original below for the exact behavior.
AI rated this skill on four points using only the contents of its SKILL.md. Stars and popularity are not taken into account.
The total counts each point as A = 25, B = 15, C = 5. Rated by AI (OpenAI Codex) as of Oct 21, 2026. Treat it as a guide and read the original before installing.
Review the instructions the agent will receive before you install.
Prerequisites:
package.json, .storybook/). If not, switch to $storybook:init.11.0.0-alpha.x) or a canary build (0.0.0-pr-*) also counts. If it is older, or upgrade/repair is needed first, switch to $storybook:upgrade and come back here afterwards. Treat a request to set up or install Storybook as approval to perform any required Storybook upgrade. For other requests, switch only after the user explicitly approves an upgrade.Run npx storybook skills setup from the project root (or the Storybook package in a monorepo).
Follow the printed Markdown precisely. Do not substitute your own plan.
No reviews yet. Tell others what you thought.
No login needed. Share how it worked for you, ask a question, or note where it did not run.
No comments yet. Be the first to write one.
Find a trial Storybook package for a specific branch, or trigger its publication when needed. Check release progress and obtain the package reference or commands for creating or upgrading a project with that build.
Look up a project's existing UI components in Storybook, including their props, or configuration inputs, and usage examples. Use the findings to answer questions and identify components to reuse before building duplicates.
Review, improve, rewrite, or draft Storybook documentation in /docs. Assess each page’s purpose, audience, structure, and examples, then make suitable edits or provide a content plan, with formatting checks after changes.
Check out a GitHub pull request, fix linting and TypeScript errors, and commit and push the changes. The workflow supports forked pull requests and repeats type checks to verify fixes while keeping changes focused on these errors.
Organize GitHub issues and pull requests found during quality assurance testing. Apply release tracking labels, classify bugs by four severity levels, and label multiple findings while keeping documentation issues and feature requests outside the severity scheme.
Work through unresolved GitHub pull request reviews one at a time. The skill explains each comment, proposes a fix, asks how to proceed, and handles chosen edits, replies, commits, and thread resolution.