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. It should be run from the root of your project.

Terminal
Loading...

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
--exact-port [number]Attempts to run Storybook on the exact port number specified.
If the port is already in use, Storybook will exit with an error message
storybook dev --exact-port 9009
-h, --host [string]Host to run Storybook
storybook dev -h my-host.com
-c, --config-dir [dir-name]Directory where to load Storybook configurations from
storybook dev -c .storybook
--loglevel [level]Controls level of logging during build.
Available options: silly, verbose, info (default), warn, error, silent
storybook dev --loglevel warn
--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
--debugOutputs more logs in the CLI to assist debugging
storybook dev --debug
--debug-webpackDisplay final webpack configurations for debugging purposes
storybook dev --debug-webpack
--stats-json [dir-name]Write stats JSON to disk
Requires Webpack
storybook dev --stats-json /tmp/stats
--no-version-updatesSkips Storybook's update check
storybook dev --no-version-updates
--docsStarts Storybook in documentation mode. Learn more about it in here
storybook dev --docs
--initial-path [path]Configures the URL Storybook should open when it opens the browser for the first time
storybook dev --initial-path=/docs/getting-started--docs
--preview-url [path]Overrides the default Storybook preview with a custom built preview URL
storybook dev --preview-url=http://localhost:1337/external-iframe.html
--force-build-previewForcefully builds Storybook's preview iframe.
Useful if you're experiencing issues, or combined with --preview-url to ensure the preview is up-to-date
storybook dev --force-build-preview
--disable-telemetryDisables Storybook's telemetry. Learn more about it here
storybook dev --disable-telemetry
--enable-crash-reportsEnables sending crash reports to Storybook's telemetry. Learn more about it here
storybook dev --enable-crash-reports

With the release of Storybook 8, the -s CLI flag was removed. We recommend using the static directory instead if you need to serve static files.

build

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

Terminal
Loading...

Options include:

OptionDescription
-h, --helpOutput usage information
storybook build --help
-V, --versionOutput the version number
storybook build -V
-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
--debugOutputs more logs in the CLI to assist debugging
storybook build --debug
--debug-webpackDisplay final webpack configurations for debugging purposes
storybook build --debug-webpack
--stats-json [dir-name]Write stats JSON to disk
Requires Webpack
storybook build --stats-json /tmp/stats
--docsBuilds Storybook in documentation mode. Learn more about it in here
storybook build --docs
--testOptimize Storybook's production build for performance and tests by removing unnecessary features with the test option. Learn more here.
storybook build --test
--preview-url [path]Overrides the default Storybook preview with a custom built preview URL
storybook build --preview-url=http://localhost:1337/external-iframe.html
--force-build-previewForcefully builds Storybook's preview iframe.
Useful if you're experiencing issues, or combined with --preview-url to ensure the preview is up-to-date
storybook build --force-build-preview
--disable-telemetryDisables Storybook's telemetry. Learn more about it here
storybook build --disable-telemetry
--enable-crash-reportsEnables sending crash reports to Storybook's telemetry. Learn more about it here
storybook build --enable-crash-reports

init

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

Terminal
Loading...

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

Options include:

OptionDescription
-h, --helpOutput usage information
storybook@latest init --help
-b, --builderDefines the builder to use for your Storybook instance
storybook@latest init --builder webpack5
-f,--forceForcefully installs Storybook into your project, prompting you to overwrite existing files
storybook@latest init --force
-s, --skip-installSkips the dependency installation step. Used only when you need to configure Storybook manually
storybook@latest init --skip-install
-t, --typeDefines the framework to use for your Storybook instance
storybook@latest init --type solid
-y, --yesSkips interactive prompts and automatically installs Storybook per specified version
storybook@latest init --yes
--package-managerSets the package manager to use when installing Storybook.
Available package managers include npm, yarn, and pnpm
storybook@latest 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@latest init --use-pnp
-p, --parserSets the jscodeshift parser.
Available parsers include babel, babylon, flow, ts, and tsx
storybook@latest init --parser tsx
--debugOutputs more logs in the CLI to assist debugging
storybook@latest init --debug
--disable-telemetryDisables Storybook's telemetry. Learn more about it here
storybook@latest init --disable-telemetry
--enable-crash-reportsEnables sending crash reports to Storybook's telemetry. Learn more about it here
storybook@latest init --enable-crash-reports

add

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

Terminal
Loading...

Options include:

OptionDescription
-h, --helpOutput usage information
storybook@latest add --help
-c, --config-dirDirectory where to load Storybook configurations from
storybook@latest migrate --config-dir .storybook
--package-managerSets the package manager to use when installing the addon.
Available package managers include npm, yarn, and pnpm
storybook@latest add [addon] --package-manager pnpm
-s, --skip-postinstallSkips post-install configuration. Used only when you need to configure the addon yourself
storybook@latest add [addon] --skip-postinstall
--debugOutputs more logs in the CLI to assist debugging
storybook@latest add --debug

remove

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

Terminal
Loading...

Options include:

OptionDescription
-h, --helpOutput usage information
storybook@latest remove --help
--package-managerSets the package manager to use when removing the addon.
Available package managers include npm, yarn, and pnpm
storybook@latest remove [addon]--package-manager pnpm
--debugOutputs more logs in the CLI to assist debugging
storybook@latest remove --debug
--disable-telemetryDisables Storybook's telemetry. Learn more about it here
storybook@latest remove --disable-telemetry
--enable-crash-reportsEnables sending crash reports to Storybook's telemetry. Learn more about it here
storybook@latest remove --enable-crash-reports

upgrade

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

Terminal
Loading...

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
-h, --helpOutput usage information
storybook@latest upgrade --help
-c, --config-dirDirectory where to load Storybook configurations from
storybook@latest upgrade --config-dir .storybook
-n, --dry-runChecks for version upgrades without installing them
storybook@latest upgrade --dry-run
-s, --skip-checkSkips the migration check step during the upgrade process
storybook@latest upgrade --skip-check
-y, --yesSkips interactive prompts and automatically upgrades Storybook to the latest version
storybook@latest upgrade --yes
-f,--forceForce the upgrade, skipping autoblockers check
storybook@latest upgrade --force
--package-managerSets the package manager to use when upgrading Storybook.
Available package managers include npm, yarn, and pnpm
storybook@latest upgrade --package-manager pnpm
--debugOutputs more logs in the CLI to assist debugging
storybook@latest upgrade --debug
--disable-telemetryDisables Storybook's telemetry. Learn more about it here
storybook@latest upgrade --disable-telemetry
--enable-crash-reportsEnables sending crash reports to Storybook's telemetry. Learn more about it here
storybook@latest upgrade --enable-crash-reports

migrate

Runs the provided codemod to ensure your Storybook project is compatible with the specified version. Read more in the migration guide.

Terminal
Loading...

The command requires the codemod name (e.g., csf-2-to-3) as an argument to apply the necessary changes to your project. You can find the list of available codemods by running storybook@latest migrate --list.

For example, storybook@latest migrate csf-2-to-3 --dry-run, checks your project to verify if the codemod can be applied without making any changes, providing you with a report of which files would be affected.

Options include:

OptionDescription
-h, --helpOutput usage information
storybook@latest migrate --help
-c, --config-dirDirectory where to load Storybook configurations from
storybook@latest migrate --config-dir .storybook
-n, --dry-runVerify the migration exists and show the files to which it will be applied
storybook@latest migrate --dry-run
-l, --listShows a list of available codemods
storybook@latest migrate --list
-g, --globGlob for files upon which to apply the codemods
storybook@latest migrate --glob src/**/*.stories.tsx
-p, --parserSets the jscodeshift parser.
Available parsers include babel, babylon, flow, ts, and tsx
storybook@latest migrate --parser tsx
-r, --rename [from-to]Renames the files affected by the codemod to include the provided suffix
storybook@latest migrate --rename ".js:.ts"
--debugOutputs more logs in the CLI to assist debugging
storybook@latest migrate --debug

automigrate

Perform standard configuration checks to determine if your Storybook project can be automatically migrated to the specified version. Read more in the migration guide.

Terminal
Loading...

For example, storybook@latest automigrate --dry-run scans your project for potential migrations that can be applied automatically without making any changes.

Options include:

OptionDescription
-h, --helpOutput usage information
storybook@latest automigrate --help
-c, --config-dirDirectory where to load Storybook configurations from
storybook@latest automigrate --config-dir .storybook
-n, --dry-runChecks for available migrations without applying them
storybook@latest automigrate --dry-run
-s, --skip-installSkip installing dependencies whenever applicable
storybook@latest automigrate --skip-install
-y, --yesApplies available migrations automatically without prompting for confirmation
storybook@latest automigrate --yes
-l, --listShows a list of available automigrations
storybook@latest automigrate --list
--package-managerSets the package manager to use when running the auto migration.
Available package managers include npm, yarn, and pnpm
storybook@latest automigrate --package-manager pnpm
--rendererSpecifies Storybook's renderer to use when running the automigration.
Useful for monorepo environments where multiple Storybook instances can exist in the same project
storybook@latest automigrate --renderer vue
--debugOutputs more logs in the CLI to assist debugging
storybook@latest automigrate --debug
--disable-telemetryDisables Storybook's telemetry. Learn more about it here
storybook@latest automigrate --disable-telemetry
--enable-crash-reportsEnables sending crash reports to Storybook's telemetry. Learn more about it here
storybook@latest automigrate --enable-crash-reports

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.

Terminal
Loading...

Options include:

OptionDescription
-h, --helpOutput usage information
storybook doctor --help
-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
--debugOutputs more logs in the CLI to assist debugging
storybook doctor --debug

info

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

Terminal
Loading...

Example output:

Terminal
Loading...

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.

Terminal
Loading...

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
-h, --helpOutput usage information
storybook sandbox --help
-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
--debugOutputs more logs in the CLI to assist debugging
storybook sandbox --debug
--disable-telemetryDisables Storybook's telemetry. Learn more about it here
storybook sandbox --disable-telemetry
--enable-crash-reportsEnables sending crash reports to Storybook's telemetry. Learn more about it here
storybook sandbox --enable-crash-reports

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

Was this page helpful?

Markdown accepted ([link text](url), _italic_, **bold**, etc). Your anonymous feedback will be posted publicly on GitHub.

✍️ Edit on GitHub – PRs welcome!
Storybook
Join the community
6,609 developers and counting
WhyWhy StorybookComponent-driven UI
DocsGuidesTutorialsChangelogTelemetryStatus
CommunityAddonsGet involvedBlog
ShowcaseExploreProjectsComponent glossary
Open source software
Storybook

Maintained by
Chromatic
Special thanks to Netlify and CircleCI