Vue组件大全包括（UI组件,开发框架,服务端,辅助工具,应用实例,Demo示例)

vue是一款比较流行的js库，本文为大家介绍一些vue组件,包括ui组件,开发框架,服务端,辅助工具,应用实例,demo示例等开源项目

一、vue常用ui组件

element ★11612 - 饿了么出品的vue2的web ui工具套件

vux ★7503 - 基于vue和weui的组件库

★5801 - 基于 vuejs 的开源 ui 组件库

mint-ui ★5517 - vue 2的移动ui元素

★2790 - 通过vue material和vue 2建立精美的app应用

★2611 - 三端样式一致的响应式 ui 库

keen-ui ★2587 - 轻量级的基本ui组件合集

★2183 - 为移动而生的vue js 2组件框架

★1734 - 快速构建移动端单页应用

★1470 - 优雅的markdown编辑器

★1368 - vue.js选择框解决方案

eagle.js ★1016 - hacker的幻灯片演示框架

vueadmin ★978 - 基于vuejs2和element的简单的管理员模板

★920 - 简化数据表格

★855 - 应用于vuejs2的twitter的bootstrap 4组件

vue.draggable ★819 - 实现拖放和视图模型数组同步

vuecirclemenu ★809 - 漂亮的vue圆环菜单

vue-chat ★803 - vuejs和vuex及webpack的聊天示例

★725 - 帮助你轻松创建web应用

★716 - vue.js触摸滑动组件

★678 - 快速开发产品的vue组件库

vue-infinite-scroll ★669 - vuejs的无限滚动指令

vue-waterfall ★668 - vue.js的瀑布布局组件

vue-beauty ★662 - 由vue和ant design创建的优美ui组件

★645 - 基于 vue 开发md风格的移动端

★607 - sublime text语法高亮

★517 - vue中的chartjs的封装

vue-echarts ★506 - vuejs的echarts组件

★497 - 日期选择插件

vue-amap ★457 - 基于vue 2和高德地图的地图组件

vue-swipe ★433 - vuejs触摸滑块

★400 - 基于quill适用于vue2的富文本编辑器

★377 - 日历和日期选择组件

gokotta ★349 - 简单的音乐播放器

★344 - 响应式ui组件轻量级库

★337 - 轻松添加拖拽排序

★333 - 好看的markdown编辑器

vue-infinite-loading ★331 - vuejs的无限滚动插件

vue-google-maps ★309 - 带有双向数据绑定google地图组件

★300 - vue轻量级进度条

★283 - vuejs写一个音乐播放器

vue-trend ★275 - 简单优雅的星光线条

★271 - 移动友好的图片文件输入组件

★271 - vonic ui的功能性组件

★261 - vuejs文件上传组件

★260 - vuejs视频及直播播放器

vue-core-image-upload ★258 - 轻量级的vue上传插件

★247 - vuejs组件封装

vue-paginate ★239 - 分页数据的简约vuejs插件

vuestar ★235 - 带星星动画的vue点赞按钮

★231 - 显示数据的bootstrap样式网格

datavisualization ★217 - 数据可视化

vue-fullcalendar ★216 - 基于vue.js的全日历组件

vue-datetime-picker ★213 - 日期时间选择控件

vue-html5-editor ★211 - html5所见即所得编辑器

★209 - 支持lunar和日期事件的日期选择器

★207 - vue日期选择器组件

★200 - 基于vuejs2的开源 ui 组件库

★197 - 无限滚动组件

vue-virtual-scroller ★196 - 带任意数目数据的顺畅的滚动

vue2-douban-market ★192 - 仿豆瓣市集webapp项目

★185 - vuejs的双向下拉刷新组件

vueditor ★174 - 所见即所得的编辑器

★171 - vuejs2数据表格

★165 - vue 滑动组件

★153 - 创建vuejs动态表格

★146 - vue轻量级滑动组件

vue-dragula ★145 - 使拖放变得简单

★142 - 用于文件上传的vue组件

★141 - 基于vue2的移动端和微信ui

vue-lazyload-img ★140 - 移动优化的vue图片懒加载插件

vue-msgbox ★139 - vuejs的消息框

vue-drag-and-drop-list ★138 - 创建排序列表的vue指令

vue-slider-component ★136 - 在vue1和vue2中使用滑块

vue-carousel-3d ★133 - vuejs的3d轮播组件

★129 - 基于微信weui所开发的专用于vue2的组件库

vue-progressive-image ★128 - vue的渐进图像加载插件

★123 - 易于使用的滑块组件

★121 - 轻松渲染一个图表

vue-impression ★118 - 移动vuejs2 ui元素

vue-simplemde ★116 - vuejs的markdown编辑器组件

★115 - 轻松创建自动提示的自定义搜索控件

★115 - vue图片剪裁上传组件

vue-data-grid ★111 - vuejs复杂桌面交互示例

★110 - 精美的点击提示对话框

★105 - 社交分享组件

★105 - 使元素可以拖拽

vue-mdeditor ★104 - 基于vue的markdown文本编辑器

vue-region-picker ★104 - 选择中国的省份市和地区

★101 - 模拟用户输入选择和删除文本的vue组件

★98 - html编辑器

★97 - 显示一组图片的lightbox组件

vue-baidu-map ★96 - 基于 vue 2的百度地图组件库

vue-svgicon ★96 - 创建svg图标组件的工具

★96 - 使用vuejs创建的datatableview

★95 - highcharts组件

vue2-loading-bar ★94 - 最简单的仿youtube加载条视图

vue-loading ★94 - 元素中加载block的vue指令

vue-tooltip ★91 - 带绑定信息提示的提示工具

★84 - vue.js的html5视频播放器

★82 - vuejs的触摸ripple组件

★77 - 漂亮的vue日期选择器组件

★73 - 下拉时间选择器

vue-toast-mobile ★73 - vuejs的toast插件

vue-scrollbar ★70 - 最简单的滚动区域组件

★67 - vuejs浮动标签模式

vue-quill ★63 - vue组件构建quill编辑器

★62 - 拥有独一无二mask的表单

vue-date-picker ★62 - vuejs日期选择器组件

★61 - 基于vue2的图片输入框

★61 - 动画的vue模态

coffeebreak ★61 - 实时编辑css组件工具

★60 - 导入谷歌登录按钮

★58 - vue 2.x的滑块组件

★58 - 处理占位符图片和乱码

★56 - 实现声明性代码幻灯片

★55 - 分页vuejs组件

★52 - 虚拟响应跨浏览器滚动条

★51 - vue的json树视图

★49 - vue.js放射性进度条组件

vue-fullcalendar ★46 - vue fullcalendar封装

vue-tagsinput ★45 - 基于vuejs的标签组件

★45 - 实现流畅轮播框的vue组件

vue-event-calendar ★45 - 简单小巧的事件日历组件

★43 - vue2及weui1开发的组件

★41 - vuejs组件封装morrisjs库

★40 - 基于flatpickr的时间选择组件

★39 - 强大的高速的vue图表解析

★39 - vue手机端网页音乐播放器

★39 - 用于管理弹出框的遮盖层

★36 - 简单高度自定义的星星评级组件

★36 - 网页表格组件

★36 - 包含一套完整的移动ui

★35 - vuejs百度企业ui

★34 - 全面的html表单管理的解决方案

★34 - 可排序可检索的表格

★34 - vue md风格组件

★33 - 响应式的侧边导航

★32 - vuejs一行代码实现优美图表

★31 - vuejs虚拟键盘组件

★30 - 基于vue的图像剪辑组件

★29 - vuejs的js表单

★29 - vuejs移动加载指示器插件

★28 - 省市区三级联动插件

★28 - vue2的上拉下拉

★28 - 懒加载背景组件的vue组件

★28 - 多tab页轻型框架

vue-ripple ★28 - 制作谷歌md风格涟漪效果的vue组件

★27 - 简单的vuejs上传组件

★25 - 用 vue 写的树层级组件

★24 - vue bulma的chartjs组件

★24 - vue 移动端轮播组件

★24 - vue滚动

vue-image-scroll ★23 - 仿网易云音乐的vue图片滚动插件

★22 - 基于vue的日期选择器

vue-waves ★21 - waves的vuejs版本

★20 - 带气泡提示的vue校验插件

★17 - 城市选择器

★16 - 整洁的视觉效果

vue-smoothscroll ★15 - smoothscroll的vuejs版本

★15 - vue组件类型

vue-img-loader ★14 - 图片加载ui组件

★14 - vue树视图组件

★13 - 简单的vuejs分页组件

★10 - vue china map可视化组件

vue-ios-alertview ★9 - ios7+ 风格的alertview服务

★9 - pacoui的vue组件

★8 - vue地区选择器

★7 - 订单来了的公共组件库

★5 - vue按钮组件

二、vue开发框架

★50611 - 流行的轻量高效的前端组件化方案

★3909 - vue管理面板框架

★1843 - 响应式网站和混合移动应用程序

electron-vue ★1677 - electron及vuejs快速启动样板

★1470 - 现代vuejs启动器

n3-components ★642 - 快速构建页面和应用

★295 - 前后端分离后的单页应用开发

★290 - vue2单页应用样板

framework7-vue ★254 - vuejs与framework7结合

vuethink ★218 - 前后端分离框架

★176 - 轻量级高性能mvvm admin ui框架

★154 - vue2项目样板

★118 - 创建业务及管理应用程序

★117 - 实时的用户友好的后台系统

jspangadmin ★111 - 基于vue2的后台管理系统

★104 - 仿vuejs vue loader示例

vue-element-starter ★58 - vue启动页

三、vue实用库

★6963 - 专为 vue.js 应用程序开发的状态管理模式

★1713 - vue的验证器插件

★1642 - vue.js 针对webpack的组件装载插件

★995 - 用于懒加载的vue模块

★931 - 简单轻量级的基于模块的vue.js验证

★863 - vuejs的多语言切换插件

★704 - qingcheng主题

vue-desktop ★484 - 创建管理面板网站的ui库

vue-socketio ★412 - vuejs的socketio实现

vue-awesome ★379 - vuejs字体awesome组件

★360 - 管理app的meta信息

★350 - 将axios整合到vuejs的封装

★343 - head标签的meta信息操作

meteor-vue-component ★325 - vue和meteor整合

★228 - 封装flatpickr的vue组件

★194 - vuejs测试实用工具库

★164 - vuejs的时间前组件

★132 - vuejs和meteor的桥接

★127 - vue2的可变彩色svg图标方案

★127 - 可重用vuejs组件的焦点指令

vue-scrollto ★111 - 滚动到元素的vuejs指令

vue-bootstrap-modal ★96 - vue的bootstrap样式组件

★92 - 跨浏览器css3动画库

★91 - 支持 vuecli 的 element ui 的后台模板

★86 - 交互式密码强度计

★84 - 结合vuejs使用的framework7组件

vuep ★83 - 用实时编辑和预览来渲染vue组件

portal-vue ★78 - 在组件外部渲染dom

★76 - 用于vue组件的延迟渲染

★74 - vuejs的剪贴板

vue-online ★73 - reactive的在线和离线组件

★72 - vuejs和属性decorator

vue-aplayer ★72 - 便于配置的音乐播放器vue2组件

★71 - vuejs无限滚动列表

★69 - 用于qartjs的vue2指令

★69 - cordova的vuejs插件

★69 - 简化事件的vuejs插件

★68 - vuejs的websocket插件

http-vue-loader ★65 - 从html及js环境加载vue文件

vue-shortkey ★62 - 应用于vue.js的vue-shortkey 插件

★62 - 具有类型支持的vuejs本地储存插件

vue-electron ★62 - 将选择的api封装到vue对象中的插件

★61 - vuejs的手势事件插件

★60 - 快速60fps视差滚动效果组件

★59 - 基于cleave.js的cleave组件

★59 - 处理vuejs事件

★56 - 页面过渡插件

vue-kindergarten ★54 - 将kindergarten集成到vuejs应用

★51 - vuejs的事件总线

★48 - 定位插件

★47 - 非阻塞通知库

vuedeux ★47 - 轻量级开源实用用层

★47 - 简约的破解文件上传器

★43 - 懒加载图片

vue-ts-loader ★42 - 在vue装载机检查脚本

vue.resize ★41 - 检测html调整大小事件的vue指令

★37 - vue插件的reactive层

★37 - 简单通用的分页组件

v-media-query ★37 - vue中添加用于配合媒体查询的方法

vue-lazy-component ★36 - 懒加载组件或者元素的vue指令

★34 - 保持mutation与视图组件的分离

★34 - html标题管理器

vue-observe-visibility ★33 - 当元素在页面上可见或隐藏时检测

vue-ls ★29 - 适配vuecontext中localstorage的vue插件

★29 - 分享某种vuex mutations

★28 - vuejs访问控制列表插件

★24 - eslint自定义解析

★21 - 适用于vue2的dom拖动组件

★18 - vue bulma的modal组件

vue-file-base64 ★18 - 将文件转换为base64的vue组件

vue.imagesloaded ★17 - 检测图片加载的vuejs指令

★16 - 使vue方法支持promise

famous-vue ★16 - famous库的vue组件

leo-vue-validator ★14 - 异步的表单验证组件

vue-titlecase ★12 - 用于字符串titlecased的vuejs过滤器

vue-easy-validator ★12 - 简单的表单验证

★11 - 一个高级zoombox

★9 - 截断字符串的vuejs过滤器

★8 - 基于内容自动调整文本输入的大小

★4 - vuejs2的数据验证插件

vue-lazyloadimg ★4 - 图片懒加载插件

四、vue服务端

★3655 - 用于服务器渲染vue app的最小化框架

★244 - 使用简单的通用vuejs应用

★206 - 简单的使用服务器端渲染vue.js

★82 - 非常简单的vuejs服务器端渲染模板

★69 - 结合express使用vue2服务端渲染

doubanmovie-ssr ★57 - vue豆瓣电影服务端渲染

★33 - nodejs服务端渲染

五、辅助工具

dejavue ★595 - vuejs可视化及压力测试

★533 - 展示vue组件的最小化框架

vscode-vuehelper ★211 - 目前vscode最好的vue代码提示插件

vue-generate-component ★45 - 轻松生成vue js组件的cli工具

★38 - 简单的多页cli

vuejsstarterkit ★29 - vuejs starter套件

六、vue应用实例

★7482 - 基于网络的个人音频流媒体服务

★4065 - 轻量级的cms建站系统

★1550 - 后台管理系统解决方案

vuedo ★1147 - 博客平台

★1029 - 个人博客系统

[pj blog](https://github.com/jcc/pj blog) ★878 - 开源博客

★707 - 重写vue版cnode社区

★487 - vuejs2管理系统

cms-of-blog ★470 - 博客内容管理器

★345 - 简单的rss阅读器

★231 - 依赖github pages无需本地生成的静态博客

★121 - 实时的协作工具

★117 - web版的聊天应用

loopa-news ★108 - 开源社会新闻应用

★77 - 使用vue2.0 和vuex的vue-blog

★70 - nuvo-dashing-js的fork

★57 - 功能极其简单的笔记本

七、demo示例

★5628 - 重写饿了么webapp

vue-cnodejs ★2347 - 基于vue重写cnodejs.org的webapp

neteasecloudwebapp ★1409 - 高仿网易云音乐的webapp

★950 - 知乎日报 with vuejs

★879 - vue2及vuex的入门练习项目

★870 - vue.js开发微信app界面

★866 - 从零构建vue2 + vue-router + vuex 开发环境

★737 - 高仿饿了么app商家详情

★695 - vue简易留言板

★605 - 单页应用启动套件

vue-music ★575 - vue 音乐搜索播放

★545 - vue/vuex/redux仿卖座网

vue-meizi ★510 - vue最新实战项目

vuedemo_sell_eleme ★475 - vue2高仿饿了么外卖平台

vue-wechat ★468 - 基于vue2高仿微信app的单页应用

★428 - 模仿豆瓣前端

★422 - 知乎日报web版

★422 - vuejs仿写酷狗音乐webapp

★374 - 蘑菇街移动端

vue-163-music ★348 - vue仿网易云音乐客户端版

★334 - vue2.0与express构建淘票票页面

easy-vue ★292 - 使用vue实现简易web

★288 - vue2实现简易豆瓣电影webapp

★280 - 登录拦截登出功能

★277 - 大学生交流平台

vue2-miniqq ★273 - 基于vue2实现的仿手机qq单页面应用

★260 - vuejs仿小米官网

★257 - 一个前后端完全分离的单页应用

★247 - node.js+vue.js+webpack快速开发框架

★216 - 基于vue2的知乎日报单页应用

★210 - 流行开源工具集成demo

vue-demo-maizuo ★203 - 使用vue2全家桶仿制卖座电影

vue-adminlte-vue-router ★198 - vue和adminlte整合应用

★187 - 豆瓣美女clone

vue-zhihudaily ★183 - 知乎日报 web 版本

★180 - tmdbvuejs应用

★173 - 本地存储的记事本

zhihu-daily-vue.js ★151 - vuejs单页网页应用

vdo ★148 - vuejs与md重构豆瓣

★148 - 简单的前后端分离案例

★136 - 使用带有django的vuejs的样板项目

★133 - 基于vue的在线电影影讯网站

x-blog ★128 - 开源的个人blog项目

★119 - vue单页应用demo

webpack-vue-vuerouter ★113 - webpack及vue开发的简单项目实例

vue-mini-shop ★113 - vuejs在线商店

★109 - 基于vue和websocket的多人在线聊天室

vueblog ★105 - 前后端分离博客

photoshare ★105 - 基于图片分享的社交平台

doubanmovie ★94 - 豆瓣电影展示

★92 - 典型前后端分离项目模板

★91 - 仿饿了么h5纯前端vue版

★88 - 使用vue2.0+vue-router+vuex创建的zhihudaily

vue-koa-demo ★84 - 使用vue2和koa1的全栈demo

★82 - 基于vue全家桶开发的知乎日报

★78 - 后台管理系统解决方案简单示例

★78 - vuejs框架搭建的rubychina平台

zhihu_daily ★71 - 基于vue和nodejs的web单页应用

vue2.x-cnode ★70 - 基于vue全家桶的cnode社区

★64 - 基于vue和element的后台管理系统

vue-quasar-admin-example ★60 - 将quasar和vuejs应用于spa项目

webapp ★59 - vue2的移动端webapp音乐播放器

doubanmovie-ssr ★57 - vue豆瓣电影服务端渲染

★55 - vue2做的出行webapp

★54 - 使用vue2完成多功能集合到小webapp

★52 - 将vue官方在线示例整合到组件中

github-explorer ★52 - 寻找最有趣的github库

★48 - 不是诗人应用

★48 - 精简版的ofvue-hackernews-2

★47 - 开源的cnode社区

seemusic ★46 - 跨平台云音乐播放器

ios7-vue ★44 - 使用vue2.0 vue-router vuex模拟ios7

vue-xiaomi-shop ★42 - 高仿小米商城的项目

cnode-vue ★39 - 基于vue和vue-router构建的cnodejs web网站spa

framework7-vuejs ★38 - 使用移动框架的示例

★37 - 音乐vuejs项目

★35 - 京东移动web商城

★34 - 用 vue 做的 cnode 官网

hyareader ★34 - 移动友好的阅读器

doubanapp ★33 - 用vue2实现仿豆瓣app

★29 - 轻松查看知乎日报内容

★28 - gankio资源的阅读应用

★26 - vuex2商城购物车demo

vue-h5plus ★24 - 前卫的vue及html5plus跨平台demo

todos_vuejs ★23 - vuejs2搭建的极简的todolist

★23 - 搭建cnode社区

vue-cnode ★22 - 使用cnode社区提供的接口

★21 - 知乎日报

★20 - vuejs直播类应用web端个人中心

vue-dropload ★19 - 用以测试下拉加载与简单路由

vue-starter ★19 - vuejs项目的简单启动页

vuejs-saleplatform ★18 - vuejs搭建的售卖平台demo

v-notes ★18 - 简单美观的记事本

★14 - 用 vue写的记事本应用

simply-calculator-vuejs ★13 - 用vuejs实现简易计算器

★11 - vuejs天气demo

本文罗列了vue ui组件,开发框架,服务端,辅助工具,应用实例,demo示例等开源项目，我们在日常开发工作中灵活运用这些vue组件会大大缩短我们的项目周期