推荐 21 个顶级的 Vue UI 库

前些天发现了一个巨牛的人工智能学习网站,通俗易懂,风趣幽默,忍不住分享一下给大家。点击跳转到教程。

1、Vuetify

Star 数为 11K,提供了 80 多个 Vue.js 组件,这些组件是根据谷歌 Material Design 指南实现的。Vuetify 支持所有平台上的浏览器,包括 IE11 和 Safari 9+(使用 polyfill),并提供了 8 个 vue-cli 模板。

地址: https://github.com/vuetifyjs/vuetify

2、Quasar

Star 数超过 6K,是构建 Vue.js 响应式网站、PWA、混合移动应用和 Electron 应用的流行框架。Quasar 还支持诸如 HTML/CSS/JS 压缩、缓存清除、摇树优化(tree shaking)、源映射、代码分割和延迟加载、ES6 转码等功能。

地址:https://github.com/quasarframework/quasar

3、Element

Star 数将近 28K,是一款面向 Web 的 Vue.js 2.0 UI 工具包。它拥有一个强大的社区和 350 个贡献者,提供了丰富的可定制组件,以及完整的样式指南和更多的资源。 地址:https://github.com/ElemeFE/element

4、Vue Material

Star 数差不多 6K,是一个实了谷歌 Material Design 的简单库。该库还提供了一个 webpack 样板、用于 Nuxt.js 的 SSR 模板和一个单独的 HTML 文件(通过这个文件开始使用框架)。这里有一些入门的例子https://codesandbox.io/s/github/vuematerial/examples/tree/master/examples/quick-start。

地址: https://github.com/vuematerial/vue-material

5、Keen-UI

Star 数将近 3.5 K,一组 Vue 组件的集合,在设计上受到了谷歌 Material Design 的启发。Keen-UI 并不是一个 CSS 框架,它不包含网格系统、排版样式等。相反,它关注的是基于 Javascript 的交互式组件。

地址:https://github.com/JosephusPaye/Keen-UI

6、Buefy

Star 数 3K 左右,基于 Bulma(https://bulma.io)提供了一组轻量级的 UI 组件。Vue.js 和 Bulma 是这个库唯一的两个内部依赖。它的大小约为 60KB(压缩后的大小,并且包含了 Bulma)。你可以查看实时文档网站(https://buefy.github.io/#/documentation/start)并在 Codepen 上运行代码。

地址: https://github.com/buefy/buefy

7、Bootstrap Vue

Star 数超过 5K,为 Vue.js 提供了 Bootstrap 4 组件和网格系统的实现,并提供了自动 WAI-ARIA 可访问性标记。

地址: https://github.com/bootstrap-vue/bootstrap-vue

8、Muse-UI

Star 数超过 6K,是另一个 Vue 2.0 MD 库,提供了 40 多个 UI 组件和可定制主题。文档主要使用中文撰写,不过大多数组件是自解释的,文档只起到辅助作用。该项目在积极的开发和维护当中。 地址:https://github.com/museui/muse-ui

9、AT-UI

Star 数接近 1.5 K,一个模块化的前端 UI 框架,用于开发基于 Vue.js 的 Web 界面,适用于桌面应用程序。它提供了 NPM+Webpack+Babel 的前端开发工作流和独立的 CSS 样式,值得一试。

地址: https://github.com/at-ui/at-ui

10、Vux

Star 数超过 13K,是一个流行的社区库,基于 WeUI 和 Vue 2.0。该库还支持 webpack+vue-loader+vux 的工作流。它的文档也是中文的。

地址: https://github.com/airyland/vux

11、iView

Star 数将近 16K,提供了数十种用 Vue.js 构建的 UI 组件和小部件,并采用了干净而优雅的设计。iView 被广泛采用,社区也在积极维护,并提供了 CLI 工具用于以可视化的方式创建项目。这个也值得一试。

地址: https://github.com/iview/iview

12、Uiv

Star 数“仅”550 左右,用于 Vue 2 的 Bootstrap 3 组件库。所有组件加起来差不多 20KB,唯一的外部依赖是 Vue 和 Bootstrap CSS,支持基于 Webpack 的工作流。 地址:https://github.com/wxsms/uiv

13、Vuikit

Star 数 1K 左右,一个用于网站界面的响应式的 Vue UI 库,设计风格干净而统一。该库作为由 Yarn 工作区管理的“monorepo”而构建,但图标和主题可作为单独的包发布。

地址: https://github.com/vuikit/vuikit

14、Onsen UI+Vue

基于流行的 Onsen-UI 框架,封装了核心 Web 组件并暴露了 Vue 风格的 API。Onsen UI 组件也被设计为能够主动对 prop 做出反应。

地址: https://onsen.io/v2/guide/vue/

15、Semantic UI+Vue

这个项目基本上是 Semantic-UI 框架与 Vue.js 的集成。该库仍在开发当中,提供了一个类似于 Semantic-UI 的 API 以及一组可定制的主题。

地址: https://semantic-ui-vue.github.io/

16、Fish-UI

Star 数“仅”为 500 左右,贡献者也只有 3 个,但 fish-ui 提供了一个基于 Vue 的 Web 工具包,其中包含整洁干净的组件。该库支持 ES2015+Webpack 工作流。它的文档不是很全,但它的设计不容忽视。

地址: https://github.com/myliang/fish-ui

17、Mint UI

Star 数超过 11K,为 Vue.js 提供 UI 元素,提供了用于构建移动应用程序的 CSS 和 JS 组件。当全部导入时,压缩后的代码只有月 30KB(JS+CSS),当然它也支持单个组件的导入。

地址: https://github.com/ElemeFE/mint-ui/

18、Framework7 Vue

这个集成提供了几乎所有的 Framework7 元素和组件,并集成了 Framework7 Router,按照 Vue 的方式来渲染页面。该库正处于积极的开发和维护当中。 地址:https://framework7.io/vue/

19、Cube UI

Star 数超过 3K,是用于 Vue.js 移动应用程序的 UI 组件库。所有组件都经过了单元测试,并且该库还支持按需进行后期编译和组件导入。这个库仍在积极开发中。

地址: https://github.com/didi/cube-ui

20、Vueblu

Star 数约 1.5K,是基于 Vue 2.0 和 Bulma 的 UI 组件库,用于构建中台和后台办公产品。它支持 ES2015 和 NPM+Webpack+Babel 工作流,并提供可自定义主题。

地址: https://github.com/chenz24/vue-blu

21、Ant Design Vue

Star 数约 1.5K,用于开发具有数十个 Ant Design 实现组件的企业级后端产品,并支持基于 Webpack 调试的构建解决方案(支持 ES6)。请注意,它的开发已经停止了一段时间。

地址: https://github.com/okoala/vue-antd

 

特别推荐

n3-components :

https://github.com/N3-components/N3-components

vuikit:

https://vuikit.js.org/

Kendu UI Vue

https://www.telerik.com/kendo-vue-ui

Office Fabric-Vue

https://github.com/aidewoode/office-ui-fabric-vue

vuestrap

http://kzima.github.io/vuestrap-base-components/#/

vueboot

http://morgul.github.io/vueboot/

framevuerk

http://framevuerk.com/

Vue WeUI

http://aidenzou.github.io/vue-weui/#!/

Vue-MDC

https://github.com/posva/vue-mdc

 

转自:http://blog.talkingdata.com/?p=5993

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/448068.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

MSCRM日志配置

之前有很多人问我在MSCRM上日志怎么做,具体的如(登录日志,操作日志)。个人认为操作日志确实比较难做(不过我可以给一个思路可以用触发器或者plugin来实现,不过比较麻烦,对系统压力也比较大&…

机动车驾驶人科目三考试项目及合格标准

机动车驾驶人科目三考试项目及合格标准 (2013年道路考试智能评判) 科目三考试综合评判标准 一般规定:道路驾驶技能满分为100分,成绩达到90分为合格。 道路驾驶技能通用评判 不合格情形:考试时出现下列情形之一的&#…

数据结构——数组

数组 github地址 数组基础 数组最大的有点:快速查询。索引快数组最好应用于 “索引有语义” 的情况但并非所有有语义的索引都适用于数组(身份证号)数组也可以处理 ”索引没有语义“ 的情况 封装数组类 数组类该具备的功能:增…

十分钟入门 RocketMQ

前些天发现了一个巨牛的人工智能学习网站,通俗易懂,风趣幽默,忍不住分享一下给大家。点击跳转到教程。 本文首先引出消息中间件通常需要解决哪些问题,在解决这些问题当中会遇到什么困难,Apache RocketMQ作为阿里开源的…

高智商孩子14个独有的特点

每一位家长都希望自己的孩子具有高智商,但据专家分析孩子的智商一种是与生俱来的,另一种是在2岁之前还可以提高的,一起来看看怎样才能提高孩子的智商? 智商高的孩子都具有哪些特点? 提高孩子智商的方法 1、改变儿童的饮食习惯。 提高孩…

Onvif2.6.1命名空间前缀对照

Onvif2.6.1命名空间前缀对照 tds http://www.onvif.org/ver10/device/wsdl tev http://www.onvif.org/ver10/events/wsdl tls http://www.onvif.org/ver10/display/wsdl tmd http://www.onvif.org/ver10/deviceIO/wsdl timg http://www.onvif.org/ver20/imaging/wsdl trt…

使用delegate类型设计自定义事件

在C#编程中,除了Method和Property,任何Class都可以有自己的事件(Event)。定义和使用自定义事件的步骤如下: (1)在Class之外定义一个delegate类型,用于确定事件程序的接口 &#xff0…

各种学习资源 文档、手册 (Docker 、springboot 、Guava、git、logback 、Linux 、MQ、vue、Axios)

前些天发现了一个巨牛的人工智能学习网站,通俗易懂,风趣幽默,忍不住分享一下给大家。点击跳转到教程。 1. Docker 中文手册 :https://yeasy.gitbooks.io/docker_practice/advanced_network/bridge.html 2. RESTful java with JA…

C语言的“编译时多态”

typeof 在 kernel 中的使用 —— C 语言的“编译时多态” C 语言本身没有多态的概念,函数没有重载的概念。然而随着 C 语言编写的软件逐渐庞大,越来越多地需要引入一些其他语言中的特性,来帮助更高效地进行开发,Linux kernel 是一…

看脸色知体内各积毒 有效清洁内脏妙方

观察下五脏六腑是否中毒。 淤血、痰湿、寒气这些不能及时排出体外,危害健康和精气神的物质,中医称之为毒素,在镜子里你也可以看出它们。识别之后,你更需要有效的内脏清洁妙方! 症状一:面色青两侧长痘黄褐斑愁云满面…

UTC Time

整个地球分为二十四时区,每个时区都有自己的本地时间。在国际无线电通信场合,为了统一起见,使用一个统一的时间,称为通用协调时(UTC, Universal Time Coordinated)。UTC与格林尼治平均时(GMT, Greenwich Mean Time)一样&#xff0…

解决:Unknown custom element: <myData> - did you register the component correctly? For recursive compon

前些天发现了一个巨牛的人工智能学习网站&#xff0c;通俗易懂&#xff0c;风趣幽默&#xff0c;忍不住分享一下给大家。点击跳转到教程。 1. 引用一个组件报错&#xff1a; Unknown custom element: <myData> - did you register the component correctly?For recursi…

无处不在的container_of

无处不在的container_of linux 内核中定义了一个非常精炼的双向循环链表及它的相关操作。如下所示&#xff1a; struct list_head {struct list_head* next, * prev; };ubuntu 12.04 中这个结构定义在 /usr/src/linux-headers-3.2.0-24-generic/include/linux/types.h 中&…

程序员学习能力提升三要素

摘要&#xff1a;IT技术的发展日新月异&#xff0c;新技术层出不穷&#xff0c;具有良好的学习能力&#xff0c;能及时获取新知识、随时补充和丰富自己&#xff0c;已成为程序员职业发展的核心竞争力。本文中&#xff0c;作者结合多年的学习经验总结出了提高程序员学习能力的三…

时间,数字 ,字符串之间的转换

package com.JUtils.base;import java.sql.Timestamp; import java.text.SimpleDateFormat;/*** 转换工具类<br>* 若待转换值为null或者出现异常&#xff0c;则使用默认值**/ public class ConvertUtils {/*** 字符串转换为int*** param str * 待转换的字符串* param …

宏定义及相关用法

宏定义及相关用法 欢迎各位补充 目录 一些成熟软件中常用的宏定义&#xff1a;使用一些内置宏跟踪调试&#xff1a;宏定义防止使用时错误&#xff1a;宏与函数 带副作用的宏参数 特殊符号&#xff1a;’#’、’##’ 1、一般用法2、当宏参数是另一个宏的时候 __VA_ARGS__与##…

解决:Cannot read property ‘component‘ of undefined ( 即 vue-router 0.x 转化为 2.x)

前些天发现了一个巨牛的人工智能学习网站&#xff0c;通俗易懂&#xff0c;风趣幽默&#xff0c;忍不住分享一下给大家。点击跳转到教程。 vue项目原本是用0.x版本的vue-router&#xff0c;但是去报出&#xff1a;Cannot read property component of undefined 这是因为版本问…

AMD Mantle再添新作,引发下代GPU架构猜想

摘要&#xff1a;今年秋天即将发布的《希德梅尔文明&#xff1a;太空》将全面支持AMD Mantle API&#xff0c;如此强大的功能背后离不开强大的CPU、GPU支持。上周AMD爆出了下一代海盗岛R9 300系列&#xff0c;据网友猜测海盗岛家族可能用上速度更快的HBM堆栈式内存。 小伙伴们…

不作35岁的程序员?

程序员三部曲--不作35岁的程序员?摩西2000 在中国&#xff0c;程序员不能超过35岁&#xff0c;似乎已经是不争的事实&#xff0c;软件开发工作就是青春饭&#xff0c;顶多靠毕业这十年的时间&#xff0c;超过这个年龄&#xff0c;要不成功跃身成为管理者&#xff0c;要不转…

linux下使用TC模拟弱网络环境

linux下使用TC模拟弱网络环境 模拟延迟传输简介 netem 与 tc: netem 是 Linux 2.6 及以上内核版本提供的一个网络模拟功能模块。该功能模块可以用来在性能良好的局域网中,模拟出复杂的互联网传输性能,诸如低带宽、传输延迟、丢包等等情 况。使用 Linux 2.6 (或以上) 版本内核…