推荐21个顶级的Vue UI库！ – TalkingData‘s Blog

推荐21个顶级的Vue UI库！

最近，随着“星球大战”（指 GitHub 的 Star 数量大比拼）的爆发，Vue.js 在 GitHub 上的 Star 数超过了 React。虽然 NPM 的下载量仍然落后于 React，但 Vue.js 的受欢迎程度似乎在持续增长。

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

重磅发布预告

排名11位的iView是由TalkingData数据可视化团队开源的UI组件库，也是一个充满情怀的开源项目。 在过去的一年里，iView共迭代了27个版本，还在近期发布了针对微信小程序开发的UI组件库——《iView Weapp》。 7.28是iView的两周年生日，iView团队也将在这一天举办发布会，正式发布iView 3.0以及5款与iView相关的神秘产品。点击文末阅读原文，就有机会亲临发布会现场。

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

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

相关文章

后缀数组水题两道

后缀数组水题两道

BZOJ1031:倍长，建sa，跑一边把sa值小于等于长度的后缀第n个字母输出BZOJ4278:直接把串合并起来建一个sa就可以了，然后直接分组贪心 转载于:https://www.cnblogs.com/dream-maker-yk/p/10068915.html
阅读更多...
js获取页面的各种高度与宽度

js获取页面的各种高度与宽度

document.body.scrollTop等属性可以获取页面滚动距离等&#xff0c;但是此类属性在xhtml标准网页或者更简单的说是带<!DOCTYPE ..>标签的页面里得到的结果是0&#xff0c; 所以一般为了兼容性都这样写 document.documentElement.scrollTop || document.body.scrollTop;以…
阅读更多...
MAC终端下常用Git命令 - 某个人 - 博客园

MAC终端下常用Git命令 - 某个人 - 博客园

送给新手的简单命令操作、远程Git和local的同步实现流程&#xff1a; 1、把git上的代码clone到本地 $ git clone http:xxxx(地址&#xff0c;可以http也可以ssh) 2、clone到本地以后、使用branch -a 查看远程所有分支 $ git branch -a 3、如若你有分支&#xff1a;master…
阅读更多...
2019河北省大学生程序设计竞赛（重现赛）B 题 -Icebound and Sequence （ 等比数列求和的快速幂取模）...

2019河北省大学生程序设计竞赛（重现赛）B 题 -Icebound and Sequence （ 等比数列求和的快速幂取模）...

题目链接&#xff1a;https://ac.nowcoder.com/acm/contest/903/B 题意&#xff1a; 给你 q,n,p,求 q1q2...qn 的和 模 p。 思路&#xff1a;一开始不会做&#xff0c;后面查了下发现有个等比数列求和的快速幂公式&#xff0c;附上链接https://www.cnblogs.com/yuiffy/p/380917…
阅读更多...
centos 升级curl版本

centos 升级curl版本

1、安装repo rpm -Uvh http://www.city-fan.org/ftp/contrib/yum-repo/rhel6/x86_64/city-fan.org-release-2-1.rhel6.noarch.rpm 2、查看该 repo 包含的 curl 版本 yum.repos.d]# yum --showduplicates list curl --disablerepo"*" --enablerepo"city*"L…
阅读更多...
nodejs服务后台持续运行

nodejs服务后台持续运行

forever.jpeg 我用本地mac连接阿里云服务器&#xff0c;启动nodejs服务&#xff0c;客户端掉线&#xff0c;服务也会终止。如何在客户端掉线的情况下&#xff0c;node服务正常运行&#xff1f; forever介绍 forever是一个nodejs守护进程&#xff0c;完全由命令行操控。forev…
阅读更多...
Java工具类DateFormatUtils详解

Java工具类DateFormatUtils详解

日期和时间格式化实用程序和常量public static String format(Calendar calendar, String pattern) 说明&#xff1a;将日历格式化为特定的模式&#xff1b;参数&#xff1a;calendar-格式化的日历对象&#xff0c;非null&#xff1b;pattern-用于格式化日历的模式,非null&…
阅读更多...
Node.js+Koa开发微信公众号个人笔记（一）准备工作 - ZhangCui - 博客园

Node.js+Koa开发微信公众号个人笔记（一）准备工作 - ZhangCui - 博客园

本人也是在学习过程中&#xff0c;所以文章只作为学习笔记&#xff0c;如果能帮到你&#xff0c;那就更好啦~当然也难免会有错误&#xff0c;请不吝指出~ 一、准备工作 1、本人学习教程&#xff1a;慕课网Scott老师的《Node.js七天搞定微信公众号》 &#xff0c;但是有点小贵…
阅读更多...
bzoj4919 大根堆

bzoj4919 大根堆

考虑二分求序列LIS的过程。 g[i]表示长度为i的LIS最小以多少结尾。 对于每个数&#xff0c;二分寻找插入的位置来更新g数组。 放到树上也是一样&#xff0c;额外加上一个合并儿子的过程。 发现儿子与儿子直接是互不影响的&#xff0c;可以直接合并。 用启发式合并set来维护这个…
阅读更多...
Oracle rowid

Oracle rowid

SYS prod>select rowid from scott.emp;ROWID ------------------ AAASPXAAEAAAACVAAA AAASPXAAEAAAACVAAB AAASPXAAEAAAACVAAC AAASPXAAEAAAACVAAD AAASPXAAEAAAACVAAE ROWID的格式如下&#xff1a; 数据对象编号 文件编号 块编号 行编号 AAASPX AAE AAAACV AAA 我们可以看…
阅读更多...
vue项目配置eslint(附visio studio code配置)

vue项目配置eslint(附visio studio code配置)

eslint基础环境搭建 全局安装eslint&#xff1a;npm install eslint -g 项目eslint初始化&#xff1a;eslint --init&#xff0c;按团队或自己的编程风格回答三道题。 ? How would you like to configure ESLint? Use a popular style guide ? Which style guide do you w…
阅读更多...
从数据库中取出数据表，导入并生成excel

从数据库中取出数据表，导入并生成excel

RequestMapping("/numericalStatement1")public void createExcel(HttpServletResponse resp) throws Exception{try {String path "G:/test.xlsx";// 创建新的Excel 工作簿XSSFWorkbook workbook new XSSFWorkbook();// 在Excel工作簿中建一工作表&…
阅读更多...
【vue-router①】router-link跳转页面传递参数 - 进击的前端之路（偶尔爬坑java小路） - SegmentFault 思否

【vue-router①】router-link跳转页面传递参数 - 进击的前端之路（偶尔爬坑java小路） - SegmentFault 思否

在vue项目中&#xff0c;往往会遇到这样的情况&#xff0c;就是要实现在一个循环列表中&#xff0c;点击其中一条跳转到下个页面&#xff0c;然后将这一条的相关数据带到下个页面中显示&#xff0c;这是个循环列表&#xff0c;无论点哪一条都是跳到相同的页面&#xff0c;只是填…
阅读更多...
RHEL7 USB installation problem and solving

RHEL7 USB installation problem and solving

版权声明&#xff1a;本文为博主原创文章。未经博主同意不得转载。 https://blog.csdn.net/scruffybear/article/details/37063701 Encountered quite a few problems while install the RHEL7, with the Windows system already installed. Problem 1:/dev/root does not exis…
阅读更多...
Vue表单类的父子组件数据传递示例_vue.js_脚本之家

Vue表单类的父子组件数据传递示例_vue.js_脚本之家

使用Vue.js进行项目开发&#xff0c;那必然会使用基于组件的开发方式&#xff0c;这种方式的确给开发和维护带来的一定的便利性&#xff0c;但如果涉及到组件之间的数据与状态传递交互&#xff0c;就是一件麻烦事了&#xff0c;特别是面对有一大堆表单的页面。 在这里记录一下…
阅读更多...
Jmeter-【JSON Extractor】-响应结果中三级key取值

Jmeter-【JSON Extractor】-响应结果中三级key取值

一、请求返回样式 二、取第三个option 三、查看结果 转载于:https://www.cnblogs.com/Nancy-Lee/p/10938758.html
阅读更多...
Day5:python之函数（3）

Day5:python之函数（3）

一、函数默认值参数 内置函数&#xff1a; input&#xff08;&#xff09;、print&#xff08;&#xff09;、int&#xff08;&#xff09; 常用模块&#xff1a; 1、列表生成式 s [1,2,3,4,5,6,7,8] for i in s:print(i1) res [ i1 for i in s] res [str(i) for i in s]prin…
阅读更多...
vue路由传参的三种基本方式 - 流年的樱花逝 - SegmentFault 思否

vue路由传参的三种基本方式 - 流年的樱花逝 - SegmentFault 思否

现有如下场景&#xff0c;点击父组件的li元素跳转到子组件中&#xff0c;并携带参数&#xff0c;便于子组件获取数据。 父组件中&#xff1a; <li v-for"article in articles" click"getDescribe(article.id)"> methods&#xff1a; 方案一&#…
阅读更多...
Rust从入门到放弃（1）—— hello，world

Rust从入门到放弃（1）—— hello，world

安装及环境配置 特点&#xff1a;安全&#xff0c;性能&#xff0c;并发rust源配置RLS安装cargo rust管理工具&#xff0c;该工具可以愉快方便的管理rust工程 #!/bin/bash mkdir learn cd learn cargo init ## 该命令会在当前目录下初始化一个## 目录下会出现一个Cargo.toml文…
阅读更多...
牛客33-tokitsukaze and Number Game(数论)

牛客33-tokitsukaze and Number Game(数论)

题目描述 tokitsukaze又在玩3ds上的小游戏了&#xff0c;现在她遇到了难关。 tokitsukaze得到了一个整数x&#xff0c;并被要求使用x的每一位上的数字重新排列&#xff0c;组成一个能被8整除的数&#xff0c;并且这个数尽可能大。 聪明的你们请帮帮可爱的tokitsukaze&#xff0…
阅读更多...
最新文章

Copyright @ 2022~2023