30个值得关注的Vue开源项目

我不是女神ヾ 2022-03-07 10:14 922阅读 0赞

**译者按：** 学习优秀的开源项目是提高代码水平最有效的方式。

*  原文: [30 Amazing Vue.js Open Source Projects for the Past Year (v.2018)][30 Amazing Vue.js Open Source Projects for the Past Year _v.2018]
 *  译者: [Fundebug][]

**为了保证可读性，本文采用意译而非直译。另外，本文版权归原作者所有，翻译仅用于学习。**

在过去的一年中，我比较了近3000个Vue.js开源项目，选出30强（1％的比例）。

这是一个有竞争力的清单，因为我仔细挑选2017年1月至12月期间发布的最佳开源Vue.js库，工具和项目。通过考虑流行度，参与度和近况来评估这份清单的质量。举个简单的例子，这份清单中的项目在某著名同性交友平台的star数平均量高达3795，还不错吧？

开源项目对程序员来说是很有用的。你可以通过读代码并且在现有项目的基础上构建一些东西来学习，因为如果想提高你的Vue开发技术，那么花些时间来玩一下过去一年你可能错过的Vue.js开源项目是很值得的。

### NO.1 ###

**[Element][]**：一套为开发者、设计师和产品经理准备的基于 Vue 2.0 的桌面端组件库**\[Github star：22004\]**。

![1661416191-5b0df9c6e9a62_articlex][]

### NO.2 ###

**[iView][]**：一套高质量的UI组件库**\[Github star：12175\]**。

![3810189163-5b0df9c6eb105_articlex][]

### NO.3 ###

**[Best-resume-ever][]**：用Vue和LESS简单、快速建立许多漂亮的简历，并创建你最好的简历。**\[Github star：8839\]**。

![102712621-5b0df9c6e9326_articlex][]

### NO.4 ###

**[Vue-element-admin][]**：一个神奇的vue后台管理系统**\[Github star：7942\]**。

![2196918800-5b0df9c6d71f6_articlex][]

### NO.5 ###

**[Vuetify][]**： Vue.js 2的Material组件库**\[Github star：7672\]**。

![3274591247-5b0df9c6a3aae_articlex][]

### NO.6 ###

**[Vue-admin][]**： Vue后台面板管理库，基于Vue 2.0和Bulma 0.3 **\[Github star：7033\]**。

![213729233-5b0df9c6a3bd4_articlex][]

### NO.7 ###

**[vue-hackernews-2.0][]**：vue-router＆vuex和服务器端渲染**\[Github star：6687\]**。

![2008342241-5b0df9c69c68f_articlex][]

### NO.8 ###

**[Vue-devtools (v 4.0)][Vue-devtools _v 4.0]**：用于调试Vue.js应用程序的Chrome devtools扩展程序**\[Github star：6292\]**。

![1659559589-5b0df9c691f34_articlex][]

### NO.9 ###

**[Vue-material][]**：Vue.js的Material design**\[Github star：5230\]**。

![2625142209-5b0df9c688b03_articlex][]

### NO.10 ###

**[Quasar][]**：构建响应式网站，PWA，混合移动应用程序（看起来很原生！）和Electron应用程序，全部同时使用相同的代码库，并基于Vue。**\[Github star：4690\]**。

![2039972362-5b0df9c65253e_articlex][]

[Fundebug][Fundebug 1]错误实时监控为您的Vue项目保驾护航！

### NO.11 ###

**[Electron-vue][]**：Electron＆Vue.js快速启动样板，包括vue-cli脚手架，通用Vue插件， electron-packager/electron-builder，单元/e2e测试，vue-devtools和webpack。**\[Github star：4527\]**。

![3464330311-5b0df9c64642e_articlex][]

### NO.12 ###

**[Vue-loader (v 13)][Vue-loader _v 13]**：Vue.js组件的Webpack加载程序(loader)**\[Github star：2588\]**。

![480603161-5b0df9c6500cc_articlex][]

### NO.13 ###

**[Vuepack (v 3.0)][Vuepack _v 3.0]**：一个使用Vue 2，Vuex，Vue-router和Webpack 2（甚至是Electron）的新潮种子项目。**\[Github star：2077\]**。

![968093761-5b0df9c642ad0_articlex][]

### NO.14 ###

**[Buefy][]**：基于Bulma的Vue.js的轻量级UI组件**\[Github star：1956\]**。

![3873750017-5b0df9c634744_articlex][]

### NO.15 ###

**[Vant][]**：YouZan的Vue.js 2.0移动用户界面**\[Github star：1730\]**。

![4026428766-5b0df9c60d191_articlex][]

### NO.16 ###

**[Codesandbox][]**：专为Web应用程序开发而设计的在线代码编辑器**\[Github star：1552\]**。

![818180553-5b0df9c5f1984_articlex][]

### NO.17 ###

**[Vuefire (v 2.0)][Vuefire _v 2.0]**：Firebase 2＆> = 3的Vue.js 1＆2绑定**\[Github star：1228\]**。

![1978496263-5b0df9c5f2ee3_articlex][]

### NO.18 ###

**[Vue-tetris][]**：使用Vue，Vuex，Immutable做俄罗斯方块**\[Github star：1152\]**。

![2647103914-5b0df9c605801_articlex][]

### NO.19 ###

**[At-ui][]**：一款全新的平面UI套件，专门用于桌面应用程序，由Vue.js 2.0制作而成。**\[Github star：1099\]**。

![1856314481-5b0df9c5e5543_articlex][]

### NO.20 ###

**[Vue-recyclerview][]**：使用vue-recyclerview掌握大型列表**\[Github star：1021\]**。

![823404614-5b0df9c5b1534_articlex][]

### NO.21 ###

**[Vuex-persistedstate (v 2.0)][Vuex-persistedstate _v 2.0]**：用本地存储保持Vuex状态**\[Github star：1009\]**。

![1690177789-5b0df9c59bfda_articlex][]

### NO.22 ###

**[Vue-test-utils][]**：用于测试Vue组件的实用程序**\[Github star：977\]**。

![1881754135-5b0df9c59298b_articlex][]

### NO.23 ###

**[Vue-meta (v 1.0)][Vue-meta _v 1.0]**：管理Vue 2.0组件中的页面元信息，支持SSR +流媒体。**\[Github star：958\]**。

![2250676931-5b0df9c58809f_articlex][]

### NO.24 ###

**[ESLint-plugin-vue][]**：官方ESLint的Vue.js插件**\[Github star：864\]**。

![1338950717-5b0df9c59b931_articlex][]

### NO.25 ###

**[Vue-js-modal][]**：易于使用，高度可定制，移动友好的Vue.js 2.0+ modal**\[Github star：775\]**。

![2952576486-5b0df9c57c4b1_articlex][]

### NO.26 ###

**[Vue-tables-2][]**：Vue.js 2 网格组件**\[Github star：540\]**。

![2708280333-5b0df9c534583_articlex][]

### NO.27 ###

**[Vue-baidu-map][]**：Vue 2.x的百度地图组件**\[Github star：540\]**。

![1254096267-5b0df9c51656a_articlex][]

### NO.28 ###

**[Vuex-loading][]**：Vue / Vuex应用程序的复杂装载程序管理**\[Github star：291\]**。

![1910883640-5b0df9c541cd7_articlex][]

### NO.29 ###

**[Vue-js-grid][]**：一个具有顺畅的排序，拖放和重新排序的Vue.js 2.x响应式网格系统。**\[Github star：248\]**。

![3833248208-5b0df9c54bb31_articlex][]

### NO.30 ###

**[Dockeron][]**：用于Docker的Electron + Vue.js**\[Github star：196\]**。

![2472256157-5b0df9c51ecb4_articlex][]

### 推荐 ###

*  [Fundebug错误监控Vue接入文档][Fundebug_Vue]
 *  [黑科技！Fundebug支持可视化重现出错场景][Fundebug 2]
 *  [Fundebug支持用户行为回溯][Fundebug 3]
 *  [Fundebug发布Vue插件，简化BUG监控接入代码][Fundebug_Vue_BUG]

### 关于Fundebug ###

[Fundebug][Fundebug 4]专注于JavaScript、微信小程序、微信小游戏、支付宝小程序、React Native、Node.js和Java线上应用实时BUG监控。 自从2016年双十一正式上线，Fundebug累计处理了9亿+错误事件，付费客户有Google、360、金山软件、百姓网等众多品牌企业。欢迎大家[免费试用][Link 1]！

![3252219156-5bd481e71ea12_articlex][]

转载时请注明作者[Fundebug][Fundebug 4]以及本文地址：  
[https://blog.fundebug.com/2018/05/29/30-amazing-vuejs-open-source/][https_blog.fundebug.com_2018_05_29_30-amazing-vuejs-open-source]

[30 Amazing Vue.js Open Source Projects for the Past Year _v.2018]: https://medium.mybridge.co/30-amazing-vue-js-open-source-projects-for-the-past-year-v-2018-d39a0d019bb7
[Fundebug]: https://fundebug.com/
[Element]: https://github.com/ElemeFE/element?utm_source=mybridge&utm_medium=blog&utm_campaign=read_more
[1661416191-5b0df9c6e9a62_articlex]: /images/20220307/561cfc6087a446c584fdbbbd23d0411a.png
[iView]: https://github.com/iview/iview?utm_source=mybridge&utm_medium=blog&utm_campaign=read_more
[3810189163-5b0df9c6eb105_articlex]: /images/20220307/f25afe6dd7ba416e87e8b31a305af751.png
[Best-resume-ever]: https://github.com/salomonelli/best-resume-ever?utm_source=mybridge&utm_medium=blog&utm_campaign=read_more
[102712621-5b0df9c6e9326_articlex]: /images/20220307/44e218ad62164a11b1157f427cb283fe.png
[Vue-element-admin]: https://github.com/PanJiaChen/vue-element-admin?utm_source=mybridge&utm_medium=blog&utm_campaign=read_more
[2196918800-5b0df9c6d71f6_articlex]: /images/20220307/ca2a97b3bbbf45bb8688def1a6cfa8a0.png
[Vuetify]: https://github.com/vuetifyjs/vuetify?utm_source=mybridge&utm_medium=blog&utm_campaign=read_more
[3274591247-5b0df9c6a3aae_articlex]: /images/20220307/751b8724cdf0415c93830b0b75096bbe.png
[Vue-admin]: https://github.com/vue-bulma/vue-admin?utm_source=mybridge&utm_medium=blog&utm_campaign=read_more
[213729233-5b0df9c6a3bd4_articlex]: /images/20220307/5932e85d0b2f4ebd9c4a03491c4fa39e.png
[vue-hackernews-2.0]: https://github.com/vuejs/vue-hackernews-2.0?utm_source=mybridge&utm_medium=blog&utm_campaign=read_more
[2008342241-5b0df9c69c68f_articlex]: /images/20220307/2fc91982d5bb47139cd22a54129a1b88.png
[Vue-devtools _v 4.0]: https://github.com/vuejs/vue-devtools?utm_source=mybridge&utm_medium=blog&utm_campaign=read_more
[1659559589-5b0df9c691f34_articlex]: /images/20220307/9f4802148ded483881b7184c5fd33ddd.png
[Vue-material]: https://github.com/vuematerial/vue-material?utm_source=mybridge&utm_medium=blog&utm_campaign=read_more
[2625142209-5b0df9c688b03_articlex]: /images/20220307/08d5db6202ef476eaadf16b692e15dc8.png
[Quasar]: https://github.com/quasarframework/quasar?utm_source=mybridge&utm_medium=blog&utm_campaign=read_more
[2039972362-5b0df9c65253e_articlex]: /images/20220307/e8e7ae998cfe4798849b14b2643131f0.png
[Fundebug 1]: https://www.fundebug.com
[Electron-vue]: https://github.com/SimulatedGREG/electron-vue?utm_source=mybridge&utm_medium=blog&utm_campaign=read_more
[3464330311-5b0df9c64642e_articlex]: /images/20220307/2cbc633d276343bdb2794fc0be9129ac.png
[Vue-loader _v 13]: https://github.com/vuejs/vue-loader?utm_source=mybridge&utm_medium=blog&utm_campaign=read_more
[480603161-5b0df9c6500cc_articlex]: /images/20220307/1424fdcd7e2b42e0b872a5df4bd1aa13.png
[Vuepack _v 3.0]: https://github.com/egoist/vuepack?utm_source=mybridge&utm_medium=blog&utm_campaign=read_more
[968093761-5b0df9c642ad0_articlex]: /images/20220307/75d24541aed54e4e9167ae1565c97a5e.png
[Buefy]: https://github.com/buefy/buefy?utm_source=mybridge&utm_medium=blog&utm_campaign=read_more
[3873750017-5b0df9c634744_articlex]: /images/20220307/c8c0956332ec41e4af490dfa7e3394ba.png
[Vant]: https://github.com/youzan/vant?utm_source=mybridge&utm_medium=blog&utm_campaign=read_more
[4026428766-5b0df9c60d191_articlex]: /images/20220307/f54e494b6c1848ee9c5e32c40eb81ea6.png
[Codesandbox]: https://github.com/CompuIves/codesandbox-client?utm_source=mybridge&utm_medium=blog&utm_campaign=read_more
[818180553-5b0df9c5f1984_articlex]: /images/20220307/76e9b812ae044fb18908be84f7f73928.png
[Vuefire _v 2.0]: https://github.com/vuejs/vuefire?utm_source=mybridge&utm_medium=blog&utm_campaign=read_more
[1978496263-5b0df9c5f2ee3_articlex]: /images/20220307/8b1fd0f8626d4ce7bf72bcb3c58ed18b.png
[Vue-tetris]: https://github.com/Binaryify/vue-tetris?utm_source=mybridge&utm_medium=blog&utm_campaign=read_more
[2647103914-5b0df9c605801_articlex]: /images/20220307/aa9c09f8ffcb494981a423a5828ba0d0.png
[At-ui]: https://github.com/AT-UI/at-ui?utm_source=mybridge&utm_medium=blog&utm_campaign=read_more
[1856314481-5b0df9c5e5543_articlex]: /images/20220307/eea0a3c9d0d64eeb8b9e82dde5d35f39.png
[Vue-recyclerview]: https://github.com/hilongjw/vue-recyclerview?utm_source=mybridge&utm_medium=blog&utm_campaign=read_more
[823404614-5b0df9c5b1534_articlex]: /images/20220307/a489563238ca438185c59c695484cdf6.png
[Vuex-persistedstate _v 2.0]: https://github.com/robinvdvleuten/vuex-persistedstate?utm_source=mybridge&utm_medium=blog&utm_campaign=read_more
[1690177789-5b0df9c59bfda_articlex]: /images/20220307/5ad42ce7a3b643ff9f36b00aa8a472cd.png
[Vue-test-utils]: https://github.com/vuejs/vue-test-utils?utm_source=mybridge&utm_medium=blog&utm_campaign=read_more
[1881754135-5b0df9c59298b_articlex]: /images/20220307/0e3e2939f9284eb595a2f64cc040e675.png
[Vue-meta _v 1.0]: https://github.com/declandewet/vue-meta?utm_source=mybridge&utm_medium=blog&utm_campaign=read_more
[2250676931-5b0df9c58809f_articlex]: /images/20220307/aab27a0a28f1404eb3c881e2ae42b033.png
[ESLint-plugin-vue]: https://github.com/vuejs/eslint-plugin-vue?utm_source=mybridge&utm_medium=blog&utm_campaign=read_more
[1338950717-5b0df9c59b931_articlex]: /images/20220307/06ac29ca5b0545efab4830a877732d96.png
[Vue-js-modal]: https://github.com/euvl/vue-js-modal?utm_source=mybridge&utm_medium=blog&utm_campaign=read_more
[2952576486-5b0df9c57c4b1_articlex]: /images/20220307/9cdce8c91a2341aba86d6660991add5e.png
[Vue-tables-2]: https://github.com/matfish2/vue-tables-2?utm_source=mybridge&utm_medium=blog&utm_campaign=read_more
[2708280333-5b0df9c534583_articlex]: /images/20220307/884f9f960648455181891543f6aa1efd.png
[Vue-baidu-map]: https://github.com/Dafrok/vue-baidu-map?utm_source=mybridge&utm_medium=blog&utm_campaign=read_more
[1254096267-5b0df9c51656a_articlex]: /images/20220307/3f84ed93b9f94a8ea7ec8a1f825e65f8.png
[Vuex-loading]: https://github.com/f/vuex-loading?utm_source=mybridge&utm_medium=blog&utm_campaign=read_more
[1910883640-5b0df9c541cd7_articlex]: /images/20220307/26308c6596ad491dbaf3322ad44b6ae2.png
[Vue-js-grid]: https://github.com/euvl/vue-js-grid?utm_source=mybridge&utm_medium=blog&utm_campaign=read_more
[3833248208-5b0df9c54bb31_articlex]: /images/20220307/43d017f7e2ae4a258cc2fab5f2ade44b.png
[Dockeron]: https://github.com/dockeron/dockeron?utm_source=mybridge&utm_medium=blog&utm_campaign=read_more
[2472256157-5b0df9c51ecb4_articlex]: /images/20220307/ba74c913e61841839e125d50cb826639.png
[Fundebug_Vue]: https://docs.fundebug.com/notifier/javascript/framework/vuejs.html
[Fundebug 2]: https://blog.fundebug.com/2018/05/21/fundebug_release_black_tech_replay/
[Fundebug 3]: https://blog.fundebug.com/2017/03/29/user-behavior-track/
[Fundebug_Vue_BUG]: https://blog.fundebug.com/2019/01/17/release-fundebug-vue/
[Fundebug 4]: https://www.fundebug.com/
[Link 1]: https://www.fundebug.com/team/create
[3252219156-5bd481e71ea12_articlex]: /images/20220307/52931c45e9824b91a199d1d08a1505c6.png
[https_blog.fundebug.com_2018_05_29_30-amazing-vuejs-open-source]: https://blog.fundebug.com/2018/05/29/30-amazing-vuejs-open-source/