SuperAPI AI 工具集

storybook

测试与质量

查看项目

更新于 10-16 05:06

技能介绍

用途:为设计系统组件建立 Storybook 文档与展示,创建交互示例、视觉测试和组件目录,帮助开发者上手设计系统。

主要能力:支持 CSF 3.0 标准故事(.stories.tsx)、MDX 文档页与 Autodocs 自动生成文档;通过 args 与 argTypes 配置 controls 面板;可添加 a11y、viewport、themes 等 addon;支持交互测试(play 函数)与自定义主题。

使用方式:安装命令为 npx storybook@latest init;在 .storybook/main.ts 配置 stories、addons、framework 与 autodocs;在 preview.ts 设置全局装饰器、参数、背景与视口;每个组件变体写一个 story,用 argTypes 定义控件,用 MDX 写文档页。

适用场景:组件文档搭建、交互式组件演练场、视觉回归测试、组件库目录、设计系统开发者入门。

限制:资料未提供具体收费、价格、平台支持范围与效果数据;部分示例依赖 React 与 @storybook/react-vite,其他框架需自行适配。