宣布 Storybook 3.3
支持 Angular、设备视口、测试改进等更多特性！
新年快乐！Storybook 精灵们在这个假期辛勤工作，我们很高兴地宣布 Storybook 3.3 发布了，这是我们为世界上最受欢迎的 UI 组件开发环境带来更多精彩的最新版本。
使用 Storybook 3.3，你可以
- 在你的 Angular 项目（v4+）中使用 Storybook
- 调整预览视口以模拟不同的设备尺寸
- 在 Storybook 中预览测试结果
- 还有更多！
继续阅读，了解我们为你准备的、旨在提高你2018年 UI 生产力的所有好东西的详细信息。
适用于 Angular 的 Storybook
在我们发布 3.2 版本 后，它展示了将 Storybook 组件开发引入 Vue 的简便性，Carlos Vega 受此启发，决定为 Angular 也做同样的事情。Angular 的工作量比预期的要大，但在 Igor Davydkin 和 Ruslan Alzinov 的帮助下，Carlos 成功完成了。
在你的 Angular 项目中开始使用它非常简单
npm i -g @storybook/cli
cd my-angular-project
getstorybook
npm run storybook请继续关注后续关于这项 Angular 工作背后细致考虑的完整文章。请在下方订阅！
设备视口
3.3 版本的第二个主要特性是 Lyft 的 Josh Callender 带来的 Viewports 插件。使用预设的不同设备尺寸来测试你的组件的响应行为
更多信息请参阅项目 README。
测试改进
最后，Storybook 3.3 包含了多项测试改进。
首先是由 Renaud Tertrais 开发的 Jest 插件，它允许你在 Storybook 中查看测试结果。并排查看视觉和功能变化，可以实现强大的测试驱动开发
其次是 Igor Davydkin 在 StoryShots 中实现的多快照功能：当 StoryShots 进行 DOM 快照时，现在可以为每个故事保存一个单独的快照文件，这使得快照审查和版本控制变得容易得多。更多信息请参阅 Igor 的文章以及 StoryShots README 中的 multiSnapshotWithOptions。
除了 Storybook 发布版本中的测试改进之外，社区中还有许多活跃的测试工具。值得注意的是 Joel Arvidsson 开发的免费工具 Loki 可视化回归测试，以及我们的朋友 Percy、Screener 和 Chromatic 提供的针对 Storybook 的付费托管和全功能测试服务。许多精力投入到使 Storybook 成为一个强大的测试平台。
还有更多！
Storybook 3.3 是我们迄今为止最大的版本，包含了数百项其他改进。完整列表请参阅我们的更新日志。以下是一些亮点
我们还在 Storybook 的开发方面取得了巨大进步，例如更简化的启动设置、闪电般的持续集成、自动 Netlify 预览、持续的项目依赖更新等等。非常感谢 Filipp Riabchun 和 Norbert de Langen 在幕后孜孜不倦的工作。很快会带来更多相关内容，请订阅以获取更新。
再接再厉，不断进步
3.3 版本是 Storybook 的第三个大型社区驱动版本。在每次迭代中，我们不仅添加了上面提到的功能，还在改进代码，并更擅长在不牺牲质量的情况下整合全球贡献者社区的新功能。
现在是为 Storybook 做出贡献的最佳时机。我们是一个友好的社区，欢迎所有人的贡献。加入我们的 Slack 频道，通过 Open Collective 支持我们，或者直接在 Github 上参与。
非常感谢为 3.3 版本做出贡献的这些优秀的社区成员：@aaronfriel @abrahamgnz @ahanriat @ajfuller @ajwhite @alterx @amorriscode @apexskier @aretecode @axelboc @baktiaditya @bcass @billydubb @billyvg @blairanderson @bmv437 @bradleyayers @brekk @chadfawcett @cheapsteak @chris-verclytte @coobaha @crtvhd @dangreenisrael @danielduan @danielsneijers @danseethaler @davegaeddert @dependencies-bot @derekstavis @derrickpelletier @digitalmaster @djspaceg @dsblv @duncanbeevers @edolyne @ethaan @filipposarzana @folmert @froggyguts @ggarek @gongreg @gpittarelli @greenkeeper[bot] @grncdr @gsimone @gustojs @gvaldambrini @herrmannplatz @hharnisc @hypnosphi @ianmcnally @igor-dv @ikasumiwt @jakedawkins @jancvanb @jbovenschen @jebarjonet @jennvoss @jgoz @jjwon0 @joscha @jozefpetro @jpshelley @jribeiro @jrwebdev @kazupon @lachlanjc @lifeiscontent @loklaan @maiis @marchdoe @marshallswain @mathiasschopmans @maxhodges @mccullochk @michaltaberski @mimamuh @mlabrum @mmnlfrrr @moaxaca @mordentware @nblackburn @ndelangen @ngyikp @orelmax @orisomething @pd4d10 @pelotom @peritus @pierrickp @promhize @psimyn @ralzinov @renaudtertrais @rhalff @rmevans9 @robrichard @rwoverdijk @rylnd @sambego @sandinosaso @saponifi3d @satazor @sfantasy @shilman @slorber @spacek33z @spaintrain @syneva-runyan @tenshiemi @terrencewwong @theshortcut @thibautre @thomasbertet @tmeasday @tobilen @tonysk @travisbloom @trevoreyre @tsuyoshiwada @tw15egan @usagi-f @usulpro @valscion @vidaaudrey @vnctaing @ximenean @yuyokk @z4o4z @zephraph @zinserjan @znck
立即获取
立即试用 Storybook 3.3。如果你已经在用 Storybook，只需一分钟即可升级。如果你还没开始使用，请尝试这种开发 React、React Native、Vue 和 Angular 组件 UI 的最佳方式
npm i -g @storybook/cli
cd my-vue-react-rn-or-angular-project
getstorybook
npm run storybook如果你有问题、困难、鼓励，或者只是对新版本感到高兴，请随时通过 Twitter、Slack、Github 或在下方评论中联系我们！
最后，要随时了解 Storybook 相关新闻，请关注我们在 Medium 上的账号，或者查看我们的 Twitter。如果你喜欢 Storybook，请为这篇文章点赞并分享，帮助更多人发现它。
来自 Storybook 团队的 ❤️。