Docs
Storybook Docs

CLI options

The Storybook command line interface (CLI) is the main tool you use to build and develop Storybook.

Storybook collects completely anonymous data to help us improve user experience. Participation is optional, and you may opt-out if you'd not like to share any information.

API commands

All of the following documentation is available in the CLI by running storybook --help.

Passing options to these commands works slightly differently if you're using npm instead of Yarn. You must prefix all of your options with --. For example, npm run storybook build -- -o ./path/to/build --quiet.

dev

Compiles and serves a development build of your Storybook that reflects your source code changes in the browser in real time. Should be run from the root of your project.

storybook dev [options]

Options include:

OptionDescription
--helpOutput usage information
storybook dev --help
-V, --versionOutput the version number
storybook dev -V
-p, --port [number]Port to run Storybook
storybook dev -p 9009
-h, --host [string]Host to run Storybook
storybook dev -h my-host.com
-s, --static-dirDeprecated see note. Directory where to load static files from, comma-separated list
storybook dev -s public
-c, --config-dir [dir-name]Directory where to load Storybook configurations from
storybook dev -c .storybook
--httpsServe Storybook over HTTPS. Note: You must provide your own certificate information
storybook dev --https
--ssl-caProvide an SSL certificate authority. (Optional with --https, required if using a self-signed certificate)
storybook dev --ssl-ca my-certificate
--ssl-certProvide an SSL certificate. (Required with --https)
storybook dev --ssl-cert my-ssl-certificate
--ssl-keyProvide an SSL key. (Required with --https)
storybook dev --ssl-key my-ssl-key
--smoke-testExit after successful start
storybook dev --smoke-test
--ciCI mode (skip interactive prompts, don't open browser)
storybook dev --ci
--no-openDo not open Storybook automatically in the browser
storybook dev --no-open
--quietSuppress verbose build output
storybook dev --quiet
--debug-webpackDisplay final webpack configurations for debugging purposes
storybook dev --debug-webpack
--webpack-stats-jsonWrite Webpack Stats JSON to disk
storybook dev --webpack-stats-json /tmp/webpack-stats
--docsStarts Storybook in documentation mode. Learn more about it in here
storybook dev --docs
--disable-telemetryDisables Storybook's telemetry. Learn more about it here
storybook dev --disable-telemetry

Starting in 6.4 the -s flag is deprecated. Instead, use a configuration object in your .storybook/main.js file. See the images and assets documentation for more information.

build

Compiles your Storybook instance so it can be deployed. Should be run from the root of your project.

storybook build [options]

Options include:

OptionDescription
-h, --helpOutput usage information
storybook build --help
-V, --versionOutput the version number
storybook build -V
-s, --static-dirDeprecated see note.
Directory where to load static files from, comma-separated list
storybook build -s public
-o, --output-dir [dir-name]Directory where to store built files
storybook build -o /my-deployed-storybook
-c, --config-dir [dir-name]Directory where to load Storybook configurations from
storybook build -c .storybook
--loglevel [level]Controls level of logging during build.
Available options: silly, verbose, info (default), warn, error, silent
storybook build --loglevel warn
--quietSuppress verbose build output
storybook build --quiet
--debug-webpackDisplay final webpack configurations for debugging purposes
storybook build --debug-webpack
--webpack-stats-jsonWrite Webpack Stats JSON to disk
storybook build --webpack-stats-json /my-storybook/webpack-stats
--docsBuilds Storybook in documentation mode. Learn more about it in here
storybook build --docs
--disable-telemetryDisables Storybook's telemetry. Learn more about it here.
storybook build --disable-telemetry
--testOptimize Storybook's production build for performance and tests by removing unnecessary features with the test option. Learn more here.
storybook build --test

init

Installs and initializes the specified version (e.g., @latest, @8, @next) of Storybook into your project. Read more in the installation guide.

storybook[@version] init [options]

For example, storybook@latest init will install the latest version of Storybook into your project.

Options include:

OptionDescription
-b, --builderDefines the builder to use for your Storybook instance
storybook init --builder webpack5
-f,--forceForcefully installs Storybook into your project, prompting you to overwrite existing files
storybook init --force
-s, --skip-installSkips the dependency installation step. Used only when you need to configure Storybook manually
storybook init --skip-install
-t, --typeDefines the framework to use for your Storybook instance
storybook init --type solid
-y, --yesSkips interactive prompts and automatically installs Storybook per specified version
storybook init --yes
--package-managerSets the package manager to use when installing the addon.
Available package managers include npm, yarn, and pnpm
storybook init --package-manager pnpm
--use-pnpEnables Plug'n'Play support for Yarn. This option is only available when using Yarn as your package manager
storybook init --use-pnp

add

Installs a Storybook addon and configures your project for it. Read more in the addon installation guide.

storybook add [addon] [options]

Options include:

OptionDescription
--package-managerSets the package manager to use when installing the addon.
Available package managers include npm, yarn, and pnpm
storybook add [addon] --package-manager pnpm
-s, --skip-postinstallSkips post-install configuration. Used only when you need to configure the addon yourself
storybook add [addon] --skip-postinstall

remove

Deletes a Storybook addon from your project. Read more in the addon installation guide.

storybook remove [addon] [options]

Options include:

OptionDescription
--package-managerSets the package manager to use when removing the addon.
Available package managers include npm, yarn, and pnpm
storybook remove [addon]--package-manager pnpm

upgrade

Upgrades your Storybook instance to the specified version (e.g., @latest, @8, @next). Read more in the upgrade guide.

storybook[@version] upgrade [options]

For example, storybook@latest upgrade --dry-run will perform a dry run (no actual changes) of upgrading your project to the latest version of Storybook.

Options include:

OptionDescription
-c, --config-dirDirectory where to load Storybook configurations from
storybook upgrade --config-dir .storybook
-n, --dry-runChecks for version upgrades without installing them
storybook upgrade --dry-run
-s, --skip-checkSkips the migration check step during the upgrade process
storybook upgrade --skip-check
-y, --yesSkips interactive prompts and automatically upgrades Storybook to the latest version
storybook upgrade --yes
--package-managerSets the package manager to use when installing the addon.
Available package managers include npm, yarn, and pnpm
storybook upgrade --package-manager pnpm

doctor

Performs a health check on your Storybook project for common issues (e.g., duplicate dependencies, incompatible addons or mismatched versions) and provides suggestions on how to fix them. Applicable when upgrading Storybook versions.

storybook doctor [options]

Options include:

OptionDescription
-c, --config-dirDirectory where to load Storybook configurations from
storybook doctor --config-dir .storybook
--package-managerSets the package manager to use when running the health check.
Available package managers include npm, yarn, and pnpm
storybook doctor --package-manager pnpm

info

Reports useful debugging information about your environment. Helpful in providing information when opening an issue or a discussion.

storybook info

Example output:

Storybook Environment Info:
 
  System:
    OS: macOS 14.2
    CPU: (8) arm64 Apple M3
    Shell: 5.9 - /bin/zsh
  Binaries:
    Node: 18.19.0 - ~/.nvm/versions/node/v18.19.0/bin/node
    npm: 10.2.3 - ~/.nvm/versions/node/v18.19.0/bin/npm <----- active
  Browsers:
    Chrome: 120.0.6099.199
  npmPackages:
    @storybook/addon-essentials: ^7.6.6 => 7.6.6
    @storybook/addon-interactions: ^7.6.6 => 7.6.6
    @storybook/addon-links: ^7.6.6 => 7.6.6
    @storybook/addon-onboarding: ^1.0.10 => 1.0.10
    @storybook/blocks: ^7.6.6 => 7.6.6
    @storybook/preset-create-react-app: ^7.6.6 => 7.6.6
    @storybook/react: ^7.6.6 => 7.6.6
    @storybook/react-webpack5: ^7.6.6 => 7.6.6
    @storybook/test: ^7.6.6 => 7.6.6
    storybook: ^7.6.6 => 7.6.6
  npmGlobalPackages:
    chromatic: ^10.2.0 => 10.2.0

sandbox

Generates a local sandbox project using the specified version (e.g., @latest, @8, @next) for testing Storybook features based on the list of supported frameworks. Useful for reproducing bugs when opening an issue or a discussion.

storybook[@version] sandbox [framework-filter] [options]

For example, storybook@next sandbox will generated sandboxes using the newest pre-release version of Storybook.

The framework-filter argument is optional and can filter the list of available frameworks. For example, storybook@next sandbox react will only offer to generate React-based sandboxes.

Options include:

OptionDescription
-o, --output [dir-name]Configures the location of the sandbox project
storybook sandbox --output /my-sandbox-project
--no-initGenerates a sandbox project without without initializing Storybook
storybook sandbox --no-init

If you're looking for a hosted version of the available sandboxes, see storybook.new.