一起养成写作习惯！这是我参与「掘金日新计划 · 4 月更文挑战」的第16天，点击查看活动详情
通常我们开发一个组件，只会考虑组件的功能，很少去考虑组件的展示，基于storybook，我们可以实现组件的功能的同时，也支持组件的快捷演示。
storybook是一个开源的能够以可视化方式进行单元测试的框架。可以将demo展示、单元测试、ui测试统一起来。
storybook内置了webpack配置，如果需要做特定的处理，也需要改webpack。 除了开发组件，storybook也可以创建很多的测试story，用来跑一些测试用例。 另外还提供了一些addons，让storybook支持扩展，也可以编写自己的addon。addon分为两个类别：分别是装饰器类别和普通类别。装饰器类别就是demo的装饰器，普通addon功能比较强大。比如：模拟事件，展示源码、可以对界面实现深度的定制。
storybook还有一些辅助模块，可以实现结构测试，用来判断整体结构是否有所偏差，这个常见的可以用来测试组件是否被改动过或者是否崩盘。另外还有交互测试，可以模拟用户的输入，总的来说，测试相关的功能还是非常强大的！
实现同样功能的还有antd使用的bisheng组件管理仓库，它对markdown支持的比较好，但是目前已经没有维护了。它的主要目的是将markdown转为静态站点，上手bijiaomafan。
在它所有的官方addon里，有很多非常有用，其中的addon-knobs可以为storybook提供动态交互的能力。是非常神奇的功能。
总结来说，可以把storybook直接扔到项目里，可以与wepback共享一套webpack配置，且组件可以在业务中和组件中同时同步，并且随时地去测试这个组件。它主要解决的是组件展示和测试的问题，可以进行组件的验收。也非常利于新人的上手，因为文档很清晰。并且支持主流框架，非常给力。
