我开发了年收入30w刀的Vue组件库

你用过Vuetify么？这是一款Vue技术栈知名的组件库，遵循谷歌Material设计规范^[1]。

Vuetify

从2016年9月第一个pre-alpha版本发布至今，已经坐拥3w2star。

围绕Vuetify组件库，还衍生出了：

• 视频课程（vuemastery^[2]、vueschool^[3]）

• 完整的支持系统（面向企业、社区）

• 社区生态

• 主题商城

这一切的正常运转，主要靠三股力量：

• 作者「John Leider」及他的妻子「Heather Leider」全职参与

• 一个核心团队^[4]

• 社区贡献

那么Vuetify每年能创造多少收入呢？答案是：30万刀。

让我们一起看看Vuetify背后的故事。

本文内容参考自I Built A $300K/Year Vue.js Component Library

转业士兵当码农

在伊拉克完成任期后，「John Leider」于13年回到家乡佛罗里达继续他的IT学业。

最初，John主要使用PHP、jQuery、MySQL从事服务端开发。

在学习Laravel（一款PHP服务端框架）过程中，John从教学视频中了解到Vue1（那时还叫Seed），他立刻爱上了这种简洁的开发风格。

作为从Vue1到2的早期用户，John一直想打造一款基于materializecss^[5]的Vue组件库。

materializecss

经过3到4个月的开发，他的组件库终于上线了，这就是Vuetify。

没有想到，Vuetify一上线就好评如潮，这激励了John继续投入数千小时来完善他。

时间来到17年10月，距离Vuetify发布已快一年时间，John决定全职投入开源工作。

开源收入

全职开源意味着需要自谋生路。好在相比于Babel这样偏低层的工具，组件库离用户更近，这意味着更多曝光量。

最初的收入来自于曝光量带来的企业、个人赞助，大概每月500刀。

随着时间推移，这部分收入已经增加到每月大概6.5k刀。

来自Patreon^[6]的收入：

来自Github Sponsor^[7]的收入：

Vuetify使用opencollective^[8]托管项目的财务收支。

除了捐赠，John也在积极探索组件库的业务模式，比如：

Vuetify为企业用户提供付费的支持服务。

然而，花费了数年时间，John也没能形成一套稳定的激励企业付费的业务。

除此之外，John开通了Vuetify商店，销售品牌服装、配饰、数码产品、页面主题等。

从最初的每月不到100刀，到现在的1.5w到2w刀。商城逐渐成为主要收入来源。

除此之外还有文档内的贴片广告：

不管是贴片广告、商城收入还是赞助收入，都是建立在Vuetify庞大的用户数与良好的口碑基础上的。

基本盘

为了维护基本盘，John将收入的大部分回馈社区，包括：

• 维护Discord^[9]社区

• 维护Github issue、Twitter账户

• 精心编写文档

• 与Vue生态的许多实体合作推出课程：

与VueMaster合作

• 为每个核心成员每月提供1k刀左右的补助

总结

可以看到，作为开源项目，Vuetify建立了完整的：从「提升用户体验」到「增加收入」的闭环。

这使得他一直在致力于打造更好的Vue组件库。

从开源中来，到开源中去。这种理念，值得其他开源项目借鉴。

遥想Vue2时代的ElementUI，同为优秀的组件库，只能一声叹息。

参考资料

[1]

Material设计规范: https://material.io/

[2]

vuemastery: https://www.vuemastery.com/

[3]

vueschool: https://vueschool.io/?friend=vuetify

[4]

核心团队: https://vuetifyjs.com/en/about/meet-the-team/

[5]

materializecss: https://materializecss.com/

[6]

Patreon: https://www.patreon.com/vuetify

[7]

Github Sponsor: https://github.com/sponsors/johnleider

[8]

opencollective: https://opencollective.com/vuetify

[9]

Discord: https://community.vuetifyjs.com/