Storybook：给网站和产品组件做可视化文档与验收台
一句话：Storybook 是前端组件开发、测试和文档工具。它适合把按钮、表单、卡片、落地页模块、后台组件单独展示出来，让设计、产品、客户都能验收界面细节。
它是什么
它给前端组件提供一个独立工作台。组件不用等整个网站跑起来，就能单独预览不同状态，例如默认状态、加载中、报错、禁用、手机端样式。
适合干什么
- 给 AI 工具站沉淀统一按钮、价格卡片、表单、弹窗组件
- 给行业包做可复用 UI 组件库，例如预约卡片、客户信息卡、工单卡
- 让客户在交付前验收页面模块，不必进入复杂后台
- 配合视觉回归测试，防止改一个页面影响全站样式
不适合干什么
- 不适合没有前端开发流程的纯内容站
- 组件库需要维护规范，否则 Storybook 会变成另一个无人维护的页面
- 客户能看到组件不代表能直接改组件，权限和预览范围要控制
常见误区
和相似工具的区别
- 和 Figma 比：Storybook 展示真实代码组件；Figma 更适合设计稿。
- 和普通文档比：Storybook 可交互、可测试；普通文档更适合文字说明。
- 和直接看网站比：Storybook 能单独看组件状态；网站只能看最终页面。