Builders

Storybook，其核心是由构建器（如 Webpack 和 Vite）驱动的。这些构建器启动开发环境，将您的代码（Javascript、CSS 和 MDX）编译成可执行的 bundle，并实时更新浏览器。

Storybook builder overview

CLI 基础知识

在深入了解如何设置 Storybook 的构建器之前，让我们先看看 CLI 如何配置它们。当您初始化 Storybook（通过 npx storybook@latest init）时，CLI 会根据您的应用程序自动检测要使用的构建器。例如，如果您正在使用 Vite，它将安装 Vite 构建器。如果您正在使用 Webpack，默认情况下它会安装 Webpack 5 构建器。

此外，您还可以向 Storybook 的 CLI 提供一个标志，并指定您想要使用的构建器

npx storybook@latest init --builder <webpack5 | vite>

手动设置

如果您未指定构建器，Storybook 默认使用 Webpack 5 构建器。如果您想在应用程序中使用不同的构建器，这些文档详细介绍了如何设置 Storybook 支持的构建器。

Vite 构建器，用于使用 Vite 打包您的 stories，并实现近乎即时的 HMR。
Webpack，用于使用 Webpack 打包您的 stories，并提高性能