vue仿微信网页版|vue+web端聊天室|仿微信客户端vue版

一、项目介绍

基于Vue2.5.6+Vuex+vue-cli+vue-router+vue-gemini-scrollbar+swiper+elementUI等技术混合架构开发的仿微信web端聊天室——vueWebChat，实现了发送消息、表情(动图)，图片、视频预览，右键菜单、截屏、截图可直接粘贴至文本框进行发送。

二、技术框架

• MVVM框架：Vue2.5.6
• 状态管理：Vuex
• 页面路由：Vue-router
• iconfont图标：阿里巴巴字体图标库
• 自定义滚动条：vue-gemini-scrollbar
• 弹窗组件：element-ui（饿了么前端UI库）
• 环境配置：node.js + cnpm + webpack
• 高德地图：vue-amap
• 图片预览：vue-photo-preview

 ◆ 点击右上角最大化按钮，可以进行全屏切换

◆ 引入公共及全局组件配置components.js

/*
    引入公共及全局组件配置
*/ 

// 引入侧边栏及联系人
import winBar from './components/winbar'
import sideBar from './components/sidebar'
import recordList from './components/recordList'
import contactList from './components/contact'

// 引入jquery
import $ from 'jquery'

// 引入wcPop弹窗插件
import wcPop from './assets/js/wcPop/wcPop'
import './assets/js/wcPop/skin/wcPop.css'

//