vue 移动端组件库调研
注:该文章相关信息截止至2019.10.10
前言
为了更好地展开移动端项目的开发工作,部门打算开发一个移动端组件库。而要要将自己的移动端组件库开发好,就得先选择一个基于 vue 并且合适的移动端组件库作为基础组件库,所以有了下文的调研和分析。
一、现有 vue 相关组件库基本分析
1. vonic (v1.1.3)
预览 star:
3261
; 用户量:218
一个基于 vue.js 和 ionic 样式的 UI 框架,用于快速构建移动端单页应用。
1 | 优势:包含比较全面的组件/服务/指令 |
2. vux (v2.9.4)
预览 star:
16337
用户量:9012
1 | 特点: |
3. Mint UI
1 | 项目特点 |
4. MUI
github star:
12077
用户量:495
1 | 项目特点: |
5. Muse-ui (V3.0.2)
github star:
7714
用户量:4106
1 | 项目特点: |
6. vant
github star:
10573
用户量:8590
有赞团队开发的移动端组件库。
1 | 项目特点; |
7. Cube UI
github star:
7095
用户量:1855
滴滴团队开发的移动端组件。
1 | 1.团队维护 |
8. NutUI (V2.1.5)
预览 star:
1346
使用量:69
NutUI是一套京东风格的移动端Vue组件库,开发和服务于移动Web界面的企业级前中后台产品。于2018.01发布。
1 | 项目特性: |
9. vue-carbon
预览
已停止维护,迁移到muse-ui
10. vum
1 | 已经两年没更新,较少用户量,缺少文档 |
11. Weex
GitHub
兼容多端的库
二、github 数据(至2019.09.22)
组件库 | star | 仓库使用量 | watch | 最近更新时间 | issue |
---|---|---|---|---|---|
vonic | 3261 | 218 | 500 | 8个月前 | 62/124 |
vux |
16337 | 9012 | 717 | 5个月前 | 705/2438 |
Mint UI | 14968 | 24931 | 500 | 2年前 | 230/972 |
MUI | 12077 | 495 | 905 | 一年前 | 309/117 |
Muse-ui | 7714 | 4106 | 290 | 6个月前 | 125/1146 |
vant |
10573 | 8590 | 297 | 今天 | 14/2647 |
Cube UI |
7095 | 1855 | 203 | 5天前 | 26/447 |
NutUI | 1346 | 69 | 62 | 2月前 | 80/65 |
Weex-UI | 4614 | 531 | 182 | 4天前 | 7/355 |
三、结合组件库调研结果,抽取以下几个组件库进行进行详细分析
选择的组件库包含: Mint UI/Vux/Muse-ui/vant/Cube-ui/
1. 功能是否全面(需求契合度,多样性等,满分10分)
Mint-UI
: 缺少对话框,卡片,容器组件,包含三大类组件(JS components, css components, form components),即29种小组件。(7分,扣在缺少部分组件)Vux
: 功能比较全面,包含11大类工具或组件(2个样式解决方案,一个新指令,7个工具函数,一个数据展示组件,2种图标展示方式,13种弹窗提示组件,5种导航组件,14种数据展示组件,29种表单组件,5种布局,3种基础组件)。(10分)Muse-Ui
: 组件超酷(个人很喜欢),组件风格可拓展(颜色,主题,icon,字体,布局),包含3种工具(过渡动画,4个指令,点击效果),5种插件,33种组件。(8分,扣在组件过于炫酷,不太符合已有需求的交互样式,使用后可能会增加工作量)。Vant
: 功能比较全面,也比较通用,比容易拓展。包含5种基础组件,14种表单组件,9种反馈组件,15种展示组件,8种导航组件,9种业务组件。(10分)Cube-Ui
: 组件缺少顶部菜单,组件多样性偏少。包含5种基础组件,12种表单组件,11种弹出层相关组件,8种滚动相关的组件(5分)
2. 是否易于拓展
Mint-UI
: 不支持国际化和主题定制,拓展性一般(主要是文档不够完善)(5分)Vux
: 不支持vue-cli3,必须配合 vux-loader 使用,less@3.x 有严重的兼容问题,文档很详细(存在什么坑以及对应解决方案,全部有给出),支持国际化(要装一个插件),支持主题颜色配置。(7分)Muse-Ui
: 未说明是否支持国际化或主题定制(5分)Vant
: 支持vue-cli3支持主题定制,颜色定制(进行样式变量的覆盖),支持国际化(多语言切换,修改默认文案),提供了一定的示例工程和适配方案。(10分)Cube-Ui
: 支持国际化,支持基于现有组件实现二次开发,使用后编译,编译时间缩短,支持主题定制。(9分)
3. 是否稳定,bug数量(参考GitHub issuse内容)
Mint-UI
: 未解决issuse超200个,未解决bug偏多(5分)Vux
: 对话框样式有bug,708个issuse未被解决,bug有点偏多,不过作者有打算重新回来维护(6分)Muse-Ui
: 未解决issuse 127个 (7分)Vant
: 还有20个issuse在等待解决,问题解决速度很快(10分)Cube-Ui
: 还有30个左右的issuse未解决,解决问题速度挺好的(10分)
4. 是否依旧维护
Mint-UI
: 未解决issuse超200个,未解决bug偏多,2两年多没有维护和更新了,凉得不行(5分)Vux
: 已恢复正常维护和更新,个人维护,最近一次更新为5个月前(8分,但是由于是个人维护,感觉不够靠谱,扣一些分)Muse-Ui
: 最近一次更新时间是7个月前 (7分)Vant
: 几乎每天都有在维护和更新,维护很勤快(10分)1
2
3
4
5
6vant 发布节奏:
修订号:每周发布,包含新特性和问题修复。
次版本号:每隔一至二个月发布,包含新特性和较大的功能更新,向下兼容。
主版本号:发布时间不定,包含不兼容更新,预计下一个主版本会与 Vue 3.0 同期发布。
补充:文档信息很完善Cube-Ui
:最近一个月有进行更新维护(9分)
5. 仓库使用量
Mint-UI
: 24931(10分,好像是出现的比较早)Vux
: 9012(9分)Muse-Ui
: 4106(7分)Vant
: 8590(现在好像变为9000多了,增长速度很快)(9分)Cube-Ui
: 1855(4分)
6. 综上5个方面,得出总体评分如下:
总的来说 ==》移动端基础组件库有赞vant
完胜
其实感觉只有这个库比较合适了,其他库要不维护积极性偏低,或用户量偏少,要不就是不利于拓展,没得选…