原文地址:https://my.oschina.net/liuyuantao/blog/1510726

1. ElemeFE/element

tag:vue javascript components

star:15.8k

link:https://github.com/ElemeFE/element

简介

Element,一套为开发者、设计师和产品经理准备的基于 Vue 2.0 的组件库,提供了配套设计资源,帮助你的网站快速成型。通过基础的 24 分栏,迅速简便地创建布局。

官网地址:http://element.eleme.io/

2. bailicangdu/vue2-elm

tag:vue

star:10.4k

link:https://github.com/bailicangdu/vue2-elm

简介

初学vue时曾在网上搜索vue的实战项目源码,无奈大部分都是简单的demo,对于深究vue没有太大的帮助,剩下的一些大部分都是像音乐播放器之类的展示型项目,交互没有预期那么复杂。但我们实际在工作中,经常会遇到有购物车的项目,这类项目因为涉及到money,所以对逻辑严谨度要求高,页面之间交互复杂,又会伴随着登录、注册、用户信息等等,常常会让我们很头疼。既然还没人用vue写过这样的项目,那不如我来写,开源出来对能看到的人也会有帮助。

此项目大大小小共 45 个页面,涉及注册、登录、商品展示、购物车、下单等等,是一个完整的流程。因为利用业余时间来做,年前就开始写,又跨个年,周期有点长,项目从零布局到完成共用了2个多月的时间,目前项目已经完成,正在进行一些性能的优化,增加详细的注释。

技术栈

vue2 + vuex + vue-router + webpack + ES6/7 + fetch + sass + flex + svg

目标功能

定位功能 -- 完成

选择城市 -- 完成

搜索地址 -- 完成

展示所选地址附近商家列表 -- 完成

搜索美食,餐馆 -- 完成

根据距离、销量、评分、特色菜、配送方式等进行排序和筛选 -- 完成

餐馆食品列表页 -- 完成

购物车功能 -- 完成

店铺评价页面 -- 完成

单个食品详情页面 -- 完成

商家详情页 -- 完成

登录、注册 -- 完成

修改密码 -- 完成

个人中心 -- 完成

发送短信、语音验证 -- 完成

下单功能 -- 完成

订单列表 -- 完成

订单详情 -- 完成

下载App -- 完成

添加、删除、修改收货地址 -- 完成

帐户信息 -- 完成

服务中心 -- 完成

红包 -- 完成

上传头像 -- 完成

3. airyland/vux

tag:vux weui vue vue-components

star:8.9k

link:https://github.com/airyland/vux

简介

Vux(读音 [v'ju:z],同views)是基于 WeUI 和 Vue(2.x) 开发的移动端 UI 组件库,主要服务于微信页面。

基于 webpack+vue-loader+vux 可以快速开发移动端页面,配合 vux-loader 方便你在 WeUI 的基础上定制需要的样式。

vux-loader 保证了组件按需使用,因此不用担心最终打包了整个 vux 的组件库代码。

vux 并不完全依赖于 WeUI,但是尽量保持整体UI样式接近 WeUI 的设计规范。最初目标是创建一个易用,实用,美观的移动端UI组件库,现在离理想状态还有不少距离,因此需要大家及时反馈问题及贡献代码。

即使你不使用 vux 的代码, 但能从源码得到一些参考那么也是件让人高兴的事情。

官网:https://vux.li/

4. iview/iview

tag:vue javascript components ui-design vue-componentsui-kit

star:8.3k

link:https://github.com/iview/iview

简介

iView 是一套基于 Vue.js 的开源 UI 组件库,主要服务于 PC 界面的中后台产品。

特性:

  • 高质量、功能丰富

  • 友好的 API ,自由灵活地使用空间

  • 细致、漂亮的 UI

  • 事无巨细的文档

  • 可自定义主题

官网:https://www.iviewui.com/

5. ElemeFE/mint-ui

tag:vue mobile component vue-componentsui-kit

star:7.2k

link:https://github.com/ElemeFE/mint-ui

简介

基于 Vue.js 的移动端组件库。

特性:

  • Mint UI 包含丰富的 CSS 和 JS 组件,能够满足日常的移动端开发需要。通过它,可以快速构建出风格统一的页面,提升开发效率。

  • 真正意义上的按需加载组件。可以只加载声明过的组件及其样式文件,无需再纠结文件体积过大。

  • 考虑到移动端的性能门槛,Mint UI 采用 CSS3 处理各种动效,避免浏览器进行不必要的重绘和重排,从而使用户获得流畅顺滑的体验。

  • 依托 Vue.js 高效的组件化方案,Mint UI 做到了轻量化。即使全部引入,压缩后的文件体积也仅有 ~30kb (JS + CSS) gzip。

官网:http://mint-ui.github.io/#!/en

6. vue-bulma/vue-admin

star:5.5k

link:https://github.com/vue-bulma/vue-admin

简介

一个基于 Vue 2.0 和 Bulma 0.3 的 后台管理框架。

特性:

  • 基于 Vue 2.0 和 Bulma 0.3 技术

  • 响应式和弹性布局

  • 多种图表类型

  • 丰富的组件或参见 vue-bulma

  • 基于优秀的第三方库

官网:https://admin.vuebulma.com

7. museui/muse-ui

tag:muse-ui material vue vuejs2 vue2

star:4.3k

link:https://github.com/museui/muse-ui

简介

基于 Vue 2.0 和 Material Design 的 UI 组件库。

特性:

  • 多功能组件,使用无忧

  • 自定义主题文件,更易扩展

  • 基于 Vue 2.0,开发更加快速

官网:https://museui.github.io

8.vuematerial/vue-material

tag:vue-material javascript vue material material-design

star:3.9k

link:https://github.com/vuematerial/vue-material

简介

Vue Material is lightweight framework built exactly according to the Material Design specs.

It aims to deliver a collection of reusable components and a series of UI Elements to build applications with support to all modern Web Browsers through Vue 2.

Build powerful and well-designed web apps that can fit on every screen. You can generate and use themes dynamically, use components on demand, take advantage of UI Elements and Components with an ease-to-use API.

官网:https://vuematerial.github.io

9. PanJiaChen/vue-element-admin

tag:vue-admin vue admin element vuex

star:3.6k

link:https://github.com/PanJiaChen/vue-element-admin

简介

这半年来一直在用 vue 写管理后台,目前后台已经有百来个个页面,十几种权限,但维护成本依然很低,所以准备开源分享一下后台开发的经验和成果。目前的技术栈主要的采用 vue + element + axios 由 webpack2 打包.由于是个人项目,所以数据请求都是用了 mockjs 模拟。注意:在次项目基础上改造开发时请移除mock文件。 写了一个系列的教程配套文章,如何从零构建后一个完整的后台项目:

  • 手摸手,带你用 vue 撸后台 系列一(基础篇)

  • 手摸手,带你用 vue 撸后台 系列二(登录权限篇)

  • 手摸手,带你用 vue 撸后台 系列三 (实战篇)

  • 手摸手,带你用 vue 撸后台 系列四(vueAdmin 一个极简的后台基础模板)

  • 手摸手,带你封装一个 vue component

功能

  • 登录/注销

  • 权限验证

  • 侧边栏

  • 面包屑

  • 富文本编辑器

  • Markdown编辑器

  • JSON编辑器

  • 列表拖拽

  • plitPane

  • Dropzone

  • Sticky

  • CountTo

  • echarts图表

  • 401,404错误页面

  • 错误日志

  • 导出excel

  • table example

  • 动态table example

  • 拖拽table example

  • 内联编辑table example

  • form example

  • 多环境发布

  • dashboard

  • 二次登录

  • 动态侧边栏(支持多级路由)

  • mock数据

  • cache tabs example

  • screenfull

  • markdown2html

  • views-tab

10.ghosh/uiGradients

tag:css design vue gradients

star:3k

link:https://github.com/ghosh/uiGradients

简介

This is an effort to give back to the community, by the community. Hopefully this will help you draw inspiration and serve as a resource for picking gradients for your own projects.

官网:http://uigradients.com/

Vue(二十七)当前GitHub上排名前十的热门Vue项目(转载)的更多相关文章

  1. GitHub上排名前100的Android开源库介绍(来自github)

    本项目主要对目前 GitHub 上排名前 100 的 Android 开源库进行简单的介绍,至于排名完全是根据 GitHub 搜索 Java 语言选择 (Best Match) 得到的结果,然后过滤了 ...

  2. 我的Android进阶之旅】GitHub 上排名前 100 的 Android 开源库进行简单的介绍

    GitHub Android Libraries Top 100 简介 本文转载于:https://github.com/Freelander/Android_Data/blob/master/And ...

  3. GitHub上排名前100的Android开源库介绍

    GitHub上排名前100的Android开源库介绍 文章来源: http://www.open-open.com/news/view/1587067#6734290-qzone-1-31660-bf ...

  4. GitHub 上排名前 100 的 Objective-C 项目简介

    主要对当前 GitHub 排名前 100 的项目做一个简单的简介, 方便初学者快速了解到当前 Objective-C 在 GitHub 的情况.   项目名称 项目信息 1. AFNetworking ...

  5. GitHub上排名前100的iOS开源库介绍(来自github)

    主要对当前 GitHub 排名前 100 的项目做一个简单的简介,方便初学者快速了解到当前 Objective-C 在 GitHub 的情况. 若有任何疑问可通过微博@李锦发联系我 项目名称 项目信息 ...

  6. GitHub 上排名前 100 的 IOS 开源库简介

    主要对当前 GitHub 排名前 100 的项目做一个简单的简介, 方便初学者快速了解到当前 Objective-C 在 GitHub 的情况. 项目名称 项目信息 1. AFNetworking 作 ...

  7. Stack Overflow 上排名前十的与API相关的问题

    Stack Overflow是一个庞大的编程知识仓库,在Stack Overflow 上,数百万的提问被回答,并且这些回答都是高质量的.这就是为什么在Google搜索结果的排行榜上,Stack Ove ...

  8. GitHub 上排名前 100 的 Android 开源库进行简单的介绍

    若有任何疑问可通过邮件或微博联系我 项目名称 项目简介 1. react-native 这个是 Facebook 在 React.js Conf 2015 大会上推出的基于 JavaScript 的开 ...

  9. 强烈推荐 GitHub 上值得前端学习的开源实战项目

    强烈推荐 GitHub 上值得前端学习的开源实战项目. Vue.js vue-element-admin 是一个后台前端解决方案,它基于和 element-ui 实现 基于 iView 的 Vue 2 ...

随机推荐

  1. 学习笔记-ResNet网络

    ResNet网络 ResNet原理和实现 总结 一.ResNet原理和实现 神经网络第一次出现在1998年,当时用5层的全连接网络LetNet实现了手写数字识别,现在这个模型已经是神经网络界的“hel ...

  2. 读spring源码(二)-XmlBeanDefinitionReader-解析BeanDefinition

    上次说到ApplicationContext加载BeanDefinition时会创建一个XmlBeanDefinitionReader,将XML解析.BeanDefinition加载委托给XmlBea ...

  3. 秋名山老司机(BS4与正则的比拼)

    因为嘉伟思杯里的一个脚本题目,16进制计算,python3正则还没学,所以没写出来.大佬跟我说也可以用BS4,从DOM上下手,直接爬下来直接一个eval就搞定了,eval可以像这样计算16进制,eva ...

  4. 7个提升Python程序性能的好习惯

    原文作者:爱coding,会编程的核电工程师. 个人博客地址:zhihu.com/people/zhong-yun-75-63 掌握一些技巧,可尽量提高Python程序性能,也可以避免不必要的资源浪费 ...

  5. leveldb(ssdb)性能、使用场景评估

    最近有个业务场景存储压力很大,写远远大于读,读也集中在最近写入,想想这不很适合采用leveldb存储么.leveldb的话好像用ssdb比较多,花了两天时间就ssdb简单做下测试,以下总结. ssdb ...

  6. 二, 字符串和编码之 python 格式化

    1),在Python中,采用的格式化方式和C语言是一致的,用%实现,看下例: >>> 'Hello, %s' % 'world' 'Hello, world' >>> ...

  7. 【java】Java组件概览(2)— 基本库

    1.Math Math相关的库包括包括浮点库(java.lang.Math和java.lang.StrictMath)和任意精度数学(java.math包). (1)java.lang.Math 该类 ...

  8. OpenStack--Rabbitmq组件消息队列

    概念 队列 MQ 全称为Message Queue,消息队列( MQ ) 是一种应用程序的通信方法.应用程序通过读写入列队的消息(针对应用程序的数据)来通信,而无需专用连接来链接它们. 消息传递指的是 ...

  9. python的学习之路(二)

    1.字符串内置功能练习#!/usr/bin/env python# *_*coding:utf-8 *_*# Author: harsonname = 'harson'name =str('harso ...

  10. Java新手问题集锦

    Java是目前最流行的编程语言之一——它可以用来编写Windows程序或者是Web应用,移动应用,网络程序,消费电子产品,机顶盒设备,它无处不在. 有超过30亿的设备是运行在Java之上的.根据Ora ...