全面收藏了涵盖桌面端、移动端(含微信)中流行、优秀的第三方Vue UI框架。
1 桌面端
1.1 ElementUI
一个基于 Vue 2.0 的桌面端组件库,由饿了么团队开源。Star 24.5k |
文档/预览 | GitHub
特点
- 一致性 Consistency
- 与现实生活一致:与现实生活的流程、逻辑保持一致,遵循用户习惯的语言和概念;
- 在界面中一致:所有的元素和结构需保持一致,比如:设计样式、图标和文本、元素的位置等。
- 反馈 Feedback
- 控制反馈:通过界面样式和交互动效让用户可以清晰的感知自己的操作;
- 页面反馈:操作后,通过页面元素的变化清晰地展现当前状态。
- 效率 Efficiency
- 简化流程:设计简洁直观的操作流程;
- 清晰明确:语言表达清晰且表意明确,让用户快速理解进而作出决策;
- 帮助用户识别:界面简单直白,让用户快速识别而非回忆,减少用户记忆负担。
- 可控 Controllability
- 用户决策:根据场景可给予用户操作建议或安全提示,但不能代替用户进行决策;
- 结果可控:用户可以自由的进行操作,包括撤销、回退和终止当前操作等。
1.2 iView
一套基于 Vue.js 的开源 UI 组件库,主要服务于 PC 界面的中后台产品。用户包括了阿里、京东、滴滴、联想、新浪…Star 13.6k |
文档 | 预览 | GitHub
特点
- 高质量、功能丰富
- 友好的 API ,自由灵活地使用空间
- 细致、漂亮的 UI
- 事无巨细的文档
- 可自定义主题
1.3 Vue Antd
Ant Design 的 Vue 实现,开发和服务于企业级后台产品。Star 1.5k |
文档/预览 | GitHub
特点
- Designed as Ant Design.
- 基于 Vue 的组件化开发模式。
- 背靠 npm 生态圈。
- 基于 webpack 的调试构建方案,支持 ES6。
1.4 N3
N3组件库是基于Vue.js构建的,让前端工程师和全栈工程师能快速构建页面和应用。Star 0.9k |
文档/预览 | GitHub
特点
- 超过60个组件 组件列表
- 自定义样式
- 支持多种模块化范式(UMD)
- 使用ES6进行开发
1.5 Vuikit
A consistent and responsive Vue UI library,
based on the front-end framework UIkit.Star 0.9k |
文档/预览 | GitHub
特点
- 基于UIKit自动继承其所有结构特征
- 提供了组件和指令的集合
- 可扩展
- 主题化
- 多浏览器支持
2移动端
2.1 vonic
一个基于 vue.js 和 ionic 样式的 UI 框架,用于快速构建移动端单页应用。 Star 2.6k |
文档 | 预览 | GitHub
特点
- 提供组件、服务、指令
- 页面路由优化
- 支持webpack & vuex
2.2 Vux
基于WeUI和Vue(2.x)开发的移动端UI组件库,主要服务于微信页面。基于webpack+vue-loader+vux可以快速开发移动端页面,配合vux-loader方便你在WeUI的基础上定制需要的样式。 Star 11.6k |
文档 | 预览 | GitHub
特点
- 多方维护,成熟方案
- 配合vux-loader保证了组件按需使用,不担心代码量
- 不完全依赖于WeUI,但保持整体UI样式接近WeUI的设计规范
2.3 Mint UI
基于 Vue.js 的移动端组件库,由饿了么前端团队开源。Star 10k |
文档 | 预览 | GitHub
特点
- 丰富的 CSS 和 JS 组件,快速构建出风格统一的页面,提升开发效率
- 按需加载组件
- 采用 CSS3 处理各种动效,避免不必要的重绘和重排,流畅顺滑
- 轻量化:全引入,压缩后的文件体积也仅有 ~30kb。
2.4 MUI
号称最接近原生APP体验的高性能前端框架。 Star 8.5k |
文档 | 预览 | GitHub
特点
- 轻量,不依赖第三方JS库
- 原生UI,以iOS平台UI为基础,补充部分Android平台特有的UI控件
- 流畅体验
2.5 Muse-ui
基于 Vue 2.0 和 Material Design 的 UI 组件库。Star 5.6k |
文档 | 预览 | GitHub
特点
- 组件丰富,基本实现了 Material Design 设计规范类的所有组件,并提供功能性的组件
- 自定义主题文件,更易扩展
2.6 Vant
有赞移动端 Vue 组件库。配套提供了:React的UI库Zent、微信小程序组件库ZanUI-WeApp。Star 2.7k |
文档/预览 | GitHub
特点
- 50+ 个经过有赞线上业务检验的组件
- 单元测试覆盖率超过 90%
- 完善的文档和示例
- 支持 babel-plugin-import
- 支持 TypeScript
- 支持 SSR
2.7 YDUI Touch
一只基于Vue2.x的移动端&微信UI。Star 1.3k |
文档 | 预览 | GitHub
特点
- 提供两种样式单位(rem 和 px)版本;
- 高质量、功能丰富;
- 友好的 API ,自由灵活地使用空间;
- 细致、漂亮的 UI;
- 单文件 Vue 组件化开发模式;
- 基于 npm + webpack + babel 开发,支持 ES2015;
- 按需加载组件
2.8 vue-carbon
基于 vuejs 1.0 开发 material design 风格的移动端 WEB UI 库。Star 0.8k |
文档 | 预览 | GitHub
2.9 Radon UI
一个帮助你快速开发产品的Vue组件库,简洁好用,效率高,让你摆脱各种定制化的烦恼。Star 0.9k |
文档/预览 | GitHub
特点
- 基于 Vue 开发的高质量UI组件
- 基于 npm + webpack + ES6 + postcss开发
- 数据驱动,简单易使用
2.10 VUE-MUI
mobile components for Vue.js。Star 0.3k |
文档/预览 | GitHub
3 参考文章
优秀的基于VUE移动端UI框架合集
Vue.js的组件和框架PC与移动 iView elementUI MintUI
vue常见前端UI库