用途:在项目中设置或配置 Storybook,以获得更佳开发体验,重点是选对插件、构建器与框架集成。核心围绕 .storybook/main.ts(主配置)与 .storybook/preview.ts(渲染配置)。
主要能力:主配置可声明 stories 匹配、addons 列表、framework(如 @storybook/react-vite、@storybook/nextjs、@storybook/react-webpack5、@storybook/vue3-vite)、docs.autodocs;preview 可配置 controls、actions、viewport、backgrounds、globalTypes 工具栏及全局 decorators。插件包括 essentials、interactions、a11y、links、coverage、storybook-dark-mode。
使用方式:按框架在 main.ts 中设置 framework 与 addons,在 preview.ts 中设置参数与装饰器;Vite 用 viteFinal 合并配置,Webpack 用 webpackFinal 设置别名,Next.js 用 nextConfigPath 并配置 staticDirs 与 TypeScript docgen。可开启 autodocs('tag' 或 true),配置故事路径与排除模式,添加主题切换、无障碍规则、覆盖率采集(@storybook/addon-coverage 与 test-runner 的 postRender)。
限制与注意:应使用类型化配置,避免硬编码绝对路径,避免重复引入 essentials 已含插件;文中未提供安装命令、具体版本、收费与价格信息。