返回博客

隆重推出:Storybook for Vue 🎉

“Storybook for <在此插入框架>”系列的第一篇

loading
Norbert de Langen
@NorbertdeLangen
最后更新

Storybook 最初被称为“React Storybook”,但在 3.0.0 版本发布时更名为“Storybook”。

正如我们在路线图中所述,此次更改是为了支持除 React 以外的更多 UI 库。今天,随着Storybook 3.2 的发布,我们很高兴推出“Storybook for <此处插入框架>”系列中的第一个
而这个就是“Storybook for Vue”!

选择从 Vue 开始是一个轻松的决定。Vue 目前正迅速流行,而且考虑到其组件化的特性,它似乎也能很好地与 Storybook 在技术上契合。👍

而且确实很契合!实现 Storybook for Vue 非常简单,这要归功于 webpack、react、vue 和 storybook 本身的灵活性,原型验证大约只需要 2 天即可完成。

花费了大量时间进行测试,并让插件支持 Storybook for Vue,同时不为 React 用户引入破坏性更改。


那么 Vue-Play 呢?

我们联系了 Vue Play(一个受 storybook 启发项目)的维护者。但似乎该项目已经被放弃了。维护 Vue-Play 本应比为整个开源社区启动一个“竞争对手”更好,但我们的一个关键目标是使所有 Storybook 与尽可能多的 storybook 插件兼容。这本身就是一个巨大的挑战,但这意味着我们真的不能继续基于 vue-play 维护者所做的努力。

插件支持情况?

很遗憾,并非所有插件都支持,但以下插件支持:addon-actionsaddon-linksaddon-knobsaddon-notes。我们将随着时间的推移慢慢推出对更多插件的支持。请告知我们您希望我们优先支持哪些插件。当然,如果您想提供帮助,也非常欢迎!

稍微解释一下为什么我们无法一开始就支持所有 storybook 插件:许多插件与 React 紧密耦合。它们使用 React 组件包装故事组件。我们不希望为非 React 项目这样做,因为这会将 React 引入他们的代码库。我们希望预览渲染由他们自己完成。这应该可以使该库的开发人员/调试器工具正常工作。🙇

我们将进行实验,以找到更好的方法来增强/调整故事,而无需使用 React 组件包装故事。
需要一些时间进行实验、找到最佳方法、实现正确的解决方案以及迁移现有插件和文档。


Storybook for Vue 演示

有 3 人参与了 Storybook for Vue 的发布,
组成了一个分工良好的团队 💪
Norbert de Langen,启动了整个过程并完成了构建工作。
Alexandre Bodin,实现了渲染功能,并完成了插件支持工作。
Kazuya Kawaguchi,为 Storybook CLI 添加了 Vue 支持,并协助了其他工作。

我们非常感谢 Vue 社区提供的帮助和鼓励!

Storybook 极大地改善了 React 的开发体验,目前被 AirBnB、Slack、Squarespace、Lonely Planet、Coursera 等公司使用。我们希望它也能为 Vue 带来同样的生产力和便利性!

如果您对 Storybook for Vue 有任何疑问、疑虑或问题,请在 GitHub 上打开一个 issue告知我们。



如果您想支持 storybook,请点击下方的爱心按钮,帮助更多人发现它。如果您想及时了解 Storybook 的进展,请关注我们的频道。我们还有更多激动人心的公告即将发布!

如果您或您的公司正在使用 storybook 并希望提供经济支持,现在可以通过 Open Collective 来实现了!经济上的支持将使我们能够支持我们的贡献者!

storybook on Open Collective
我们的使命是为设计师、开发人员和利益相关者创建最好的 UI 工具。

♥️️ storybook 团队

加入 Storybook 邮件列表

获取最新消息、更新和发布信息

7,468开发者及更多

我们正在招聘!

加入 Storybook 和 Chromatic 团队。构建被数十万开发人员在生产中使用的工具。远程优先。

查看职位

热门帖子

宣布推出 Storybook 3.2

Vue 支持、故事层级、RN 设备内 UI 等!
loading
Michael Shilman

宣布 Storybook 3.3

Angular 支持、设备视口、测试改进等!
loading
Michael Shilman

开放的开源软件

Storybook 的开放开源
loading
Norbert de Langen
加入社区
7,468开发者及更多
原因为什么选择 Storybook组件驱动的 UI
文档指南教程更新日志遥测
社区插件参与进来博客
展示探索项目组件词汇表
开源软件
Storybook - Storybook 中文

特别感谢 Netlify CircleCI