用途：Storybook 是前端组件工作台，可在不运行整个应用及其逻辑/API 的情况下隔离开发 UI 组件与页面，适用于 React、Vue、Svelte、Angular 等。
主要能力：以组件故事格式 CSF 3 声明式定义组件变体；通过 args 与 controls 交互式调整属性；用 play 函数配合 Testing Library 模拟用户交互并断言结果；通过 MSW 插件拦截组件网络请求以渲染异步状态；借助 Chromatic 做跨浏览器视口的视觉回归检测；通过 @storybook/addon-a11y 做组件无障碍审计；可发布为设计系统文档与组件目录。
使用方式：初始化与启动命令为 npx storybook@latest init 和 npm run storybook。故事文件使用 Meta、StoryObj 类型导出，例如定义 meta 的 title、component、tags、argTypes，再导出带 args 的具名故事。交互测试从 @storybook/test 引入 within、userEvent、expect，在 play 中操作 canvasElement。MSW 通过 parameters.msw.handlers 配置 http.get 等处理器。
适用场景：隔离组件开发、设计系统与样式指南文档、视觉回归测试、无障碍审计、加载与错误等异步状态演示。
限制与注意：资料未提供收费、价格与平台支持细节。常见问题包括路径别名或 CSS 导入未被识别（需在 .storybook/main.ts 的 webpackFinal 或 viteFinal 添加别名）、stories glob 未匹配到文件（检查 stories 配置）、组件因缺少 React context 或路由 provider 无法渲染（需在 preview 装饰器中包裹对应 provider）。建议避免在组件中导入应用路由或全局状态，改用 props 传递回调与状态；不要硬编码静态 args，应利用 controls 测试边界内容；不要忽略加载与错误状态，应为骨架屏、空数据和网络错误建立专门故事。