最近,随着“星球大战”(指 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:
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
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://blog.talkingdata.com/?p=5993 原文最早发布于 2018 年 7 月 9 日
表格如果字段多,有横向滚动条是不是不方便?可拖拽的滚动是不是就方便了?
使用create-vue创建vue3项目,vite,vue3
相对VUE2 ,VUE3做了哪些优化和改进呢?
vue项目,不使用window.location.reload(),如何刷新当前页面?
FATAL ERROR: CALL_AND_RETRY_LAST Allocation failed - JavaScript heap out of memory
vue2.0 v-html指令有潜在的xss风险,如何解决?
vue项目通过axios怎么下载二进制文件或图片?
ant.design UI框架 同时使用v-model或value属性时, placeholder不显示
如何在VUE项目中添加stylelint,检查css,scss,less的语法问题,保证团队代码的规范统一
VUE全局函数
定义了服务端渲染的属性名称常量SSR_ATTR,定义了一些资产类型常量ASSET_TYPES,定义了生命周期相关钩子函数的函数名称
使用iviewui-admin框架构建管理系统时,遇到的各类问题
vue项目中动态图片路径拼接
vue下filter方法的调用
21个vue顶级UI框架: Vuetify,Quasar,Vue Material,Keen-UI,Buefy,Bootstrap Vue,Muse-UI,AT-UI,Vux,iView,Uiv,Vuikit,Onsen UI+Vue,Semantic UI+Vue,Fish-UI,Mint UI,Framework7 Vue,Cube UI,Vueblu,Ant Design Vue
".vue"文件是如何解析成js对象的~
立个flag,看过年这段时间能不能把vue的源码读完?多年前看过jQuery的部分源码,如果想要更深入的了解vue,还是得从源码开始
vue源码阅读,慢慢学习
vue的生命周期函数
vue组件的数据data为什么一定要是函数 ?
Mint-ui this.$messagebox点取消时,报错:Uncaught (in promise) cancel
vue-validate使用
这就是个vue的坑。。。
vue如何监听enter事件?
vue使用axios进行form表单提交
vue中如何改变title标题
如果在vue2.0中使用NProgress进度条
Axios 是一个基于 promise 的 HTTP 库,可以用在浏览器和 node.js 中。也是vue2.0官方推荐的,同时不再对vue-resource(vue1.0使用)进行更新和维护
分析Vue.js源码
npm run dev模式下,webpack4+vue2项目下,类似'/user/login'二级路由,刷新时静态资源路径不对,静态资源返回404
[Vue warn]: Error in render: "TypeError: Cannot read property 'matched' of undefined"
did you register the component correctly? For recursive components, make sure to provide the "name" option
vue.js如何查看注册了哪些组件,获取组件名称
vue底层的Virtual DOM就是基于snabbdom修改的