Vue全家桶+Socket.io+Express/Koa2打造的网页版手机QQ(web app),高仿手机QQ7.1.0版本

预览 在线预览地址：https://qq.lenshen.com （为了体验到最佳的效果，提供了3个测试账号，需要账号才能登陆哦，具体账号和密码下面有讲） 目前项目已开源，源码地址：https://github.com/lensh/vue-qq 技术栈 Vue2.0：实现前端页面构建 Vuex：实现不同组件间的状态共享 Vue-router：页面路由切换,实现单页的核心 vueg：页面复杂场景切换效果 Socket.io：实现实时消息推送 axios：一个基于 Promise 的 HTTP 库，向后端发起请求 Express、Koa2：开发环境使用Express，生产环境使用Koa2 ES6、ES7、ES8：服务端和客户端均使用ES6语法，promise/async/await 处理异步 localStorage：本地保存用户信息 Webpack：模块打包，前端项目构建工具首选 SASS(SCSS)：CSS预处理语言 Flex：flex弹性布局，简单适配手机、PC端 CSS3：CSS3过渡动画及样式 IScroll：模拟原生app的列表滚动效果(ListView) MySQL：MySQL关系型数据库持久化数据（考虑到表与表之间关系复杂，需要多表查询，最复杂的时候是六张表联查，用MySQL会比Mongodb好得多） jsonp：跨域请求数据 pm2：服务端使用pm2部署，常驻进程，比forever好用得多（https://github.com/Unitech/pm2） nginx：服务端使用nginx代理端口转发

使用方式 先将根目录下的qq.sql导入到你的MySQL数据库里(可以使用Navicat)，用户名为root，登录密码为空。启动MySQL服务。然后使用cnpm install 安装所有依赖(最好用cnpm安装，因为项目依赖很多，npm用的是国外的镜像，在网络不稳定的情况下很有可能会导致安装失败，而且下载速度远远慢于国内的cnpm)，最后运行npm run dev。服务器部署运行项目只需要npm run pm2，这样就可以常驻进程，不过前提是得先全局安装pm2。 尽量使用Chrome浏览器体验最佳效果。另外提供了三个测试账号，默认用户的密码都是6个1: qq:986992484 密码:111111 qq:986992483 密码:111111 qq:986992482 密码:111111 目前已经实现了QQ的核心功能，如消息列表、好友列表、新朋友、好友申请、实时群聊、实时私聊、聊天设置、屏蔽对方聊天、特别关心、会员等级、个性名片、添加好友、删除好友、好友分组、查找用户、登录、注销、切换用户、右滑显示侧栏等等。后期会考虑增加更多功能。 如果你想体验实时聊天的酷炫效果，那么你可以打开两个浏览器，用上面不同的账号登录即可。

截图 消息页面 好友页面

最后 源码地址：https://github.com/lensh/vue-qq 在线预览地址：https://qq.lenshen.com 如果觉得不错，就毫不吝啬地给个star吧。后期项目还会继续更新和完善。