前言:
Vue.js(读音 /vjuː/, 类似于 view)是一套构建用户界面的渐进式框架。与其他重量级框架不同的是,Vue 采用自底向上增量开发的设计。Vue 的核心库只关注视图层,并且非常容易学习,非常容易与其它库或已有项目整合。另一方面,Vue 完全有能力驱动采用单文件组件和Vue生态系统支持的库开发的复杂单页应用。
Vue.js 的目标是通过尽可能简单的 API 实现响应的数据绑定和组合的视图组件。
Vue.js 自身不是一个全能框架——它只聚焦于视图层。因此它非常容易学习,非常容易与其它库或已有项目整合。另一方面,在与相关工具和支持库一起使用时,Vue.js 能完美地驱动复杂的单页应用。

本篇文章就是对pc端的各大组件库进行分析比较 ,以便根据实际情况选择自己需要的组件库,包括pc端和移动端。

目录简介:

  • 1、Element(pc):饿了么前端团队开发的桌面端组件库
  • 2、iView(pc):主要服务于 PC 界面的中后台产品
  • 3、vuetify(pc):一个试图推动前端开发发展到一个新水平的组件
  • 4、vue-strap(pc):基于 Bootstrap 标记和 CSS 的本地 Vue.js 组件
  • 5、buefy(pc):即装即用的轻量级UI组件
  • 6、Vue-Blu(pc):全面、灵活且强大的ui组件
  • 7、vue-beauty(pc):漂亮的 vue 组件库
  • 8、at-ui(pc):一个体面的干净整洁的 UI 组件
  • 9、Keen UI:纯英文文档
  • 10、Vue Material:具有精美动效的组件

1、Element(pc):饿了么前端团队开发的桌面端组件库

介绍: 饿了么前端团队开发的桌面端组件库,当前最新版本:v2.8.2
Star: 37.186k
项目特点:

1.团队维护
2.支持三个版本:vue、react、angular
3.支持 Nuxt.js
4.常规支持:多语言、自定义主题、按需引入、内置过渡动画
5.文档详细,组件齐全
6.支持响应式布局,提供基于断点的隐藏类
7.适合常规 pc 端项目

样式: 类名大量使用计算属性,css 和主文件分离单独一个文件
官网地址
GitHub地址

2、iView(pc):主要服务于 PC 界面的中后台产品

最新版本: v3.4.1
Star: 21.063k
项目特点:

1.团队维护
2.支持: Nuxt.js、TypeScript、Electron
3.常规支持:多语言、自定义主题、按需引入
4.文档详细,组件齐全
5.支持响应式布局
6.UI 比较美观
7.适合常规 pc 端项目,皮肤美观

样式: less 计算属性 前缀嵌套
官网地址
GitHub地址

3、vuetify(pc):一个试图推动前端开发发展到一个新水平的组件

介绍: Vuetifyjs 根据材料设计规格提供 UI 布局。 V 1.0 Alpha 版本提供了超过 80个 reusbale 组件,其中包含一个易于记忆的语义设计,它基于名称简单明了 type-as-you 的类型属性。在GitHub 上有超过 18K 的 star。
官网地址

4、vue-strap(pc):基于 Bootstrap 标记和 CSS 的本地 Vue.js 组件

介绍: 基于 Vue.js 的 Bootstrap 组件 该仓库包含一系列基于 Bootstrap 标记和 CSS 的本地 Vue.js 组件。所以不需要 jQuery 和 Bootstrap 的 JavaScript 文件,唯一需要依赖的是: Vue.js Bootstrap CSS ,VueStrap 不依赖某个非常精确的 Bootstrap 版本。如果喜欢bootstrap的小伙伴又不想换jquery的开发方式是不二的选择。
官网地址

5、buefy(pc):即装即用的轻量级UI组件

**介绍:**Buefy 基于 Bulma 和 Vue.js 的轻量级UI组件,它提供了即装即用的轻量级组件。虽然组件选择有限,但是值得你去尝试。
官网地址

6、Vue-Blu(pc):全面、灵活且强大的ui组件

介绍: Vue-Blu是基于Vuejs和Bulma开发的开源UI组件库。旨在为PC端的前端开发(特别是中后台产品)提供一个快速且灵活的解决方案。全面、灵活且强大的ui组件,API友好。
官网地址

7、vue-beauty(pc):漂亮的 vue 组件库

介绍: 基于 ant design 的漂亮的 vue 组件库;vue-beauty 是一套基于 vue.js 和 ant-design样式 的PC端 UI 组件库,旨在帮助开发者提升产品体验和开发效率、降低维护成本。
官网地址

8、at-ui(pc):一个体面的干净整洁的 UI 组件

介绍: AT-UI 是一个模块化的前端 UI 框架,开发基于Vue.js 的快速和强大的 Web 界面。专门为桌面应用程序构建,AT-UI提供了一套 npm + webpack + babel 前端开发工作流程。全英文的文档对用户来说可能是具有有挑战性的,但它提供了一个体面的干净整洁的 UI 组件。
官网地址

9、Keen UI:纯英文文档

最新版本: v3.7.1
Star: 3.700k
项目特点:
纯英文文档。

官网地址
GitHub地址

10、Vue Material:具有精美动效的组件

最新版本: v1.0.0
Star: 7.831k
项目特点:
1.Material 设计:是一个轻量级的框架, 建立在谷歌的 Material Design 基础上。 设计强大的和美观的web应用并适用于不同的屏幕。
2.全功能应用:可以动态地生成和使用主题,根据自己的需求只用组件,UI元素与组件的优势在于可以更简单的使用API和其他的。
3.兼容性:它的目的是提供一组可重用的组件和一系列的UI元素,使用 Vue 2.0 建立支持 主流的浏览器 的应用。

官网地址
GitHub地址

:以上最新版本号和Star数量更新于2019/4/30。
参考地址:

  • VueUI哪家强?
  • 2018年九个很受欢迎的vue前端UI框架
  • Vue移动端UI框架盘点
  • 推荐21个顶级的Vue UI库

Vue常用组件库的比较分析(pc端)相关推荐

  1. 《吐血整理》系列 大厂前端组件库工具集合(PC端、移动端、JS、CSS等)

    前言 Coding 应当是一生的事业,而不仅仅是 30 岁的青春饭 本文已收录 GitHub https://github.com/ponkans/F2E,欢迎 Star,持续更新 上一篇<吐血 ...

  2. Vue UI 组件库大起底 element VS iview VS ...

    最近接触了几个开源项目,发现大家都在用iview框架,趁机整理一下自己接触过的几个基于Vue.js的UI组件库 Element,一套为开发者.设计师和产品经理准备的基于 Vue 2.0 的桌面端组件库 ...

  3. Vue UI 组件库(移动端常用 UI 组件库,PC 端常用 UI 组件库,Element UI基本使用,Element UI按需引入)

    文章目录 Vue UI 组件库 7.1 移动端常用 UI 组件库 7.2 PC 端常用 UI 组件库 7.3 Element UI基本使用 7.4 Element UI按需引入 Vue UI 组件库 ...

  4. 16款优秀的Vue UI组件库推荐

    16款优秀的Vue UI组件库推荐 Vue 是一个轻巧.高性能.可组件化的MVVM库,API简洁明了,上手快.从Vue推出以来,得到众多Web开发者的认可. 在公司的Web前端项目开发中,多个项目采用 ...

  5. ajax插件库,03.vue-ajax、vue UI 组件库

    vue-ajax vue 项目中常用的 2 个 ajax 库 vue-resource: vue 插件, 非官方库, vue1.x 使用广泛 axios: 通用的 ajax 请求库, 官方推荐, vu ...

  6. 17款优秀的Vue UI组件库汇总

    17款优秀的Vue UI组件库推荐 Vue 是一个轻巧.高性能.可组件化的MVVM库,API简洁明了,上手快.从Vue推出以来,得到众多Web开发者的认可. 在公司的Web前端项目开发中,多个项目采用 ...

  7. 【Vue学习】—Vue UI组件库(二十八)

    [Vue学习]-Vue UI组件库(二十八) 一.移动端常用的UI组件库 二.PC端常用的UI组件库 三.具体使用自行查看文档,这里就不做概述了

  8. Vue UI组件库总结推荐

    基于Vue的Quasar Framework 介绍 这个框架UI组件很全面,准备下次使用这个框架了 基于Vue的Quasar Framework 中文网 http://www.quasarchs.co ...

  9. 优秀的Vue UI组件库

    Vue 是一个轻巧.高性能.可组件化的MVVM库,API简洁明了,上手快.从Vue推出以来,得到众多Web开发者的认可.在公司的Web前端项目开发中,多个项目采用基于Vue的UI组件框架开发,并投入正 ...

最新文章

  1. 超越时代的天才——图灵
  2. 腾讯 AI 医学进展破解“秃头”难题,登 Nature 子刊!
  3. python处理时间戳
  4. 博易大师 行情服务器文件,博易大师目录
  5. 35岁之后程序员的认可度不是很高
  6. java nio 应用场景_BIO、NIO、AIO简述及应用场景
  7. linux查看tcl版本_查看Linux内核版本的方法有几个?你也是这样操作吗?
  8. oracle获取登录名,oracle如何获取当前登录的用户名
  9. android sqlite 示例,android SQLite数据库使用示例
  10. 病毒周报(080901至080907)
  11. UI设计实用素材|2020动画将占据中心舞台
  12. 计算连续登陆最大天数
  13. docker alpine wkhtmltopdf
  14. 处理App状态改变的策略
  15. 2022最新黑马程序员大数据Hadoop入门
  16. 安装Adobe Reader出错回滚
  17. 使用阿里云国际版创建外贸网站,需要注意什么?-Unirech
  18. JS睡眠sleep()
  19. 【数学】指数函数与对数函数的导数证明
  20. 太阳直射点纬度计算公式_高中地理——每日讲1题(晨昏线、正午太阳高度角、太阳的方位)...

热门文章

  1. 智能化工厂数字孪生可视化展示更大限度优化质量流程
  2. 清华陈文光教授:AI 超算基准测试的最新探索和实践。 道翰天琼认知智能平台为您揭秘新一代人工智能。
  3. IllegalStateException: Could not resolve view with name
  4. 黑盒功能测试工具UFT的使用
  5. php用while循环输出99乘法表,用while循环语句编程输出九九乘法口诀表
  6. 鼠标下面小圆圈脚贴丢了
  7. 开源项目大全 ...
  8. 卸载DreamScene
  9. 流媒体入门系列文章(转自观止云公众号)
  10. H5播放大视频,高清视频