{"id":13008,"library":"create-storybook","title":"Storybook CLI Installer","description":"The `create-storybook` package is the official command-line interface (CLI) tool for initializing new Storybook projects and adding Storybook to existing projects. It automates the setup of Storybook with various frameworks like React, Vue, Angular, Svelte, and Web Components, configuring builders like Webpack or Vite, and installing necessary dependencies and addons. The current stable version is 10.3.5, with active development indicated by frequent alpha releases (e.g., 10.4.0-alpha.x) suggesting a continuous integration and release cadence, likely leading to major stable updates every few months. Its key differentiator is being the canonical and supported method to get started with Storybook, ensuring compatibility and best practices are followed for a smooth development workflow for UI components in isolation.","status":"active","version":"10.3.5","language":"javascript","source_language":"en","source_url":"https://github.com/storybookjs/storybook","tags":["javascript","storybook","cli","create","init"],"install":[{"cmd":"npm install create-storybook","lang":"bash","label":"npm"},{"cmd":"yarn add create-storybook","lang":"bash","label":"yarn"},{"cmd":"pnpm add create-storybook","lang":"bash","label":"pnpm"}],"dependencies":[],"imports":[{"note":"This package is a CLI tool and is not imported directly into JavaScript/TypeScript code. The `npx storybook@latest init` command is the officially recommended way to initialize a Storybook project, which leverages `create-storybook` internally. Using `npx create-storybook@latest` directly is also possible but less common in documentation.","wrong":"npx create-storybook@latest","symbol":"init (npx)","correct":"npx storybook@latest init"},{"note":"For Yarn users, `yarn create storybook` is the idiomatic way to invoke the Storybook initializer, equivalent to `npx storybook@latest init`.","wrong":"yarn create create-storybook","symbol":"init (yarn)","correct":"yarn create storybook"},{"note":"`npm create <initializer>` (since npm 6.1.0) is the modern way to run `create-<initializer>` packages. `npm init storybook` might work as an alias on some systems, but `npm create storybook@latest` is the explicit and recommended command.","wrong":"npm init storybook","symbol":"init (npm)","correct":"npm create storybook@latest"}],"quickstart":{"code":"npx storybook@latest init\n\n# Follow the interactive prompts to select your framework (e.g., React, Vue, Angular)\n# and configure Storybook. Once installation is complete, navigate into your project directory.\ncd my-storybook-project\n\n# Start Storybook's development server\nnpm run storybook","lang":"typescript","description":"Initializes a new Storybook project in the current directory, guides through setup, and then demonstrates how to launch the Storybook development server."},"warnings":[{"fix":"If you use the `@storybook/addon-mcp` for AI-assisted UI development workflows, ensure you upgrade it to version `>=0.5.0` to re-enable component manifests. Otherwise, you might need to manually configure Storybook to re-enable the manifest if a configuration option becomes available, or adjust your workflow.","message":"Storybook versions 10.3.5 and higher disable the component manifest by default. If your project relies on this feature, particularly when upgrading from an older Storybook 10.x version (>= 10.3.0) without the `@storybook/addon-mcp` installed or updated, this will be a breaking change.","severity":"breaking","affected_versions":">=10.3.5"},{"fix":"Ensure your Node.js version is 20 or higher for optimal compatibility. Use a Node.js version manager like `nvm` to easily switch and manage Node.js versions (e.g., `nvm install 20 && nvm use 20`).","message":"Storybook, especially recent versions installed by `create-storybook`, requires modern Node.js environments. Node.js versions older than 18 are officially deprecated, and versions older than 20 might experience issues or be unsupported for the latest Storybook features.","severity":"gotcha","affected_versions":">=10.0.0"},{"fix":"Always use `npx storybook@latest init` or `npm create storybook@latest` to ensure you are running the most current version of the installer and benefiting from the latest features and bug fixes.","message":"Using `npx create-storybook` or `npm init storybook` without specifying `@latest` can lead to an outdated installer being used, which may set up an older Storybook version or contain known bugs.","severity":"gotcha","affected_versions":"<10.3.5"},{"fix":"Avoid installing alpha or beta versions in production environments. Explicitly use `@latest` with `npx storybook@latest init` or `npm create storybook@latest` to get the most recent stable release. If testing pre-release features, be prepared for instability and consult the specific alpha/beta changelogs.","message":"Storybook's rapid release cycle includes frequent alpha and beta versions (e.g., `10.4.0-alpha.x`). While these introduce cutting-edge features, they are not stable and may contain bugs or breaking changes not documented in stable releases.","severity":"gotcha","affected_versions":">=10.4.0-alpha.0"}],"env_vars":null,"last_verified":"2026-04-19T00:00:00.000Z","next_check":"2026-07-18T00:00:00.000Z","problems":[{"fix":"Upgrade your Node.js environment to version 20 or newer. Use `nvm install 20 && nvm use 20` or similar for your preferred Node.js version manager.","cause":"The installed Node.js version does not meet Storybook's minimum requirements, which are increasingly strict with newer Storybook releases.","error":"Error: Your current version of Node.js is X. Storybook requires Node.js >= Y."},{"fix":"Ensure you are using the correct command: `npm create storybook@latest` or `npx storybook@latest init`. Also, ensure your `npm` client is up to date (`npm install -g npm@latest`).","cause":"Incorrect command syntax for `npm create` or an outdated `npm` client. This error often occurs when `npm init` is used incorrectly or `npm create` with wrong arguments.","error":"npm ERR! code EUSAGE"},{"fix":"Try reinstalling project dependencies (`npm install` or `yarn install`) in your project directory. If the problem persists, check your `package.json` for conflicting dependencies or try re-running `npx storybook@latest init` with the `--force` flag (if available and appropriate) or consult Storybook's troubleshooting guide for builder-specific issues.","cause":"Webpack, Vite, or other builder dependencies were not correctly installed or there's a version mismatch after Storybook setup, possibly due to a corrupted `node_modules` or conflicting peer dependencies.","error":"Error: Cannot find module 'webpack' (or other builder-related module) after installation."}],"ecosystem":"npm","meta_description":null,"install_score":null,"install_tag":null,"quickstart_score":null,"quickstart_tag":null,"pypi_latest":null,"cli_name":"create-storybook"}