SuperAPI AI 工具集

storybook

前端与建站

查看项目

更新于 10-15 22:16

技能介绍

用途:面向 React 组件的文档与测试,基于 Storybook 8,使用 CSF 3.0 编写 stories,配合 Controls、Actions 展示与调试组件,并支持视觉测试与 MDX 扩展文档。

主要能力:以 Meta/StoryObj 定义组件元信息与故事;通过 argTypes 配置 select、radio、boolean、text、number、color、object、date 等控件;用 action 记录事件回调;用 tags: ['autodocs'] 自动生成文档;支持 decorators 包裹、带状态的交互故事、viewport 响应式预览,以及按 Atomic Design(Atoms/Molecules/Organisms/Templates/Pages)组织侧边栏。

使用方式:每个组件一个 stories 文件,与组件同目录,命名如 ComponentName.stories.tsx,可选 ComponentName.mdx 写扩展文档。示例结构:import type { Meta, StoryObj } from '@storybook/react',定义 const meta: Meta 并 export default meta,再导出各 Story。

适用场景:React 组件库的文档化、交互演示、视觉回归测试与设计系统维护。

限制:资料未提供安装命令、版本依赖、具体配置步骤、收费与平台信息,暂未提供。