【Storybook】Storybook在React中的使用

本文将结合自身使用Storybook近半年的感受从：

• 什么是Storybook？
• 为什么要使用Storybook？
• 如何快速使用Storybook？
• 自定义Webpack配置
• 代理设置

这几个方面来介绍Storybook

---

1. 什么是Storybook？

Storybook 是一个使用户能够独立创建组件，并在隔离的开发环境中以交互方式展示组件的工具。简单说就是组件的展示工具。

2.为什么要使用Storybook？

在React开发的过程中需要写很多各种各样的组件，但是在写组件、调试组件样式时我们经常会遇见这样的问题：

• 无法很直观的看到组件在页面上的呈现效果
• 在组件较多时无法快速找到自己所需要的组件
• 组件无法直观的进行分类管理

而Storybook则可以解决这些问题：

可以对组件进行分类管理，也很方便的查看和调试组件，极大的提高了开发的效率。

3.如何快速使用Storybook