构建器

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

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，提供改进的性能。
Rspack / Rsbuild，用于使用极速的 Rspack 和 Rsbuild 打包你的 stories。