项目简介

IM 是基于uniapp和vue2.0进行开发的即时通讯系统静态页面。

快速上手

用HBuilderX运行和打包项目

技术栈

基于vue2 uniapp开发的移动端项目

项目目录

E:\项目\front-end-template\im
├─App.vue -------------------------------------------------- 根组件
├─main.js -------------------------------------------------- 入口js
├─manifest.json -------------------------------------------- uniapp项目配置文件
├─pages.json ----------------------------------------------- 路由页面和全局相关配置
├─uni.promisify.adaptor.js --------------------------------- uniapp适配js
├─uni.scss ------------------------------------------------- 项目全局scss，文件内的样式会编译到各个页面
├─vue.config.js -------------------------------------------- webpack配置文件
├─utils ---------------------------------------------------- 工具函数目录
|   ├─emoji.js --------------------------------------------- 表情编译和解析js
|   ├─im.js ------------------------------------------------ websocket类
|   ├─index.js --------------------------------------------- 全局工具函数
|   └permission.js ----------------------------------------- app权限函数
├─store ---------------------------------------------------- 全局状态管理目录
├─static --------------------------------------------------- 静态资源目录
|   ├─style ------------------------------------------------ css样式目录
|   ├─mp3 -------------------------------------------------- 音频静态资源
|   ├─images ----------------------------------------------- 图片目录
|   |   ├─tabbar ------------------------------------------- tabbar图片
|   |   ├─emoji -------------------------------------------- 表情图片
|   |   ├─avatars ------------------------------------------ 聊天头像
├─pages ---------------------------------------------------- 页面目录
|   ├─my --------------------------------------------------- 我的页面
|   | ├─EditPassword.vue ----------------------------------- 修改密码
|   | ├─EditPhone.vue -------------------------------------- 修改手机号
|   | ├─My.vue --------------------------------------------- 个人中心
|   | ├─MyAdd.vue ------------------------------------------ 我的发布
|   | ├─Nickname.vue --------------------------------------- 修改昵称
|   | ├─Setting.vue ---------------------------------------- 个人设置
|   | ├─Signature.vue -------------------------------------- 个性签名
|   | └UserInfo.vue ---------------------------------------- 用户信息
|   ├─login ------------------------------------------------ 登录目录
|   |   ├─Country.vue -------------------------------------- 选择国家
|   |   ├─Cropper.vue -------------------------------------- 头像剪裁
|   |   ├─Forgot.vue --------------------------------------- 忘记密码
|   |   ├─Login.vue ---------------------------------------- 登录
|   |   └Register.vue -------------------------------------- 注册
|   ├─home ------------------------------------------------- 首页目录
|   |  └Home.vue ------------------------------------------- 首页
|   ├─find ------------------------------------------------- 发现
|   |  ├─Add.vue ------------------------------------------- 添加发现
|   |  └Find.vue ------------------------------------------- 发现列表
|   ├─contact ---------------------------------------------- 联系人
|   |    ├─AddFriend.vue ----------------------------------- 添加好友
|   |    ├─ChooseUser.vue ---------------------------------- 选择好友
|   |    ├─Contact.vue ------------------------------------- 联系人
|   |    ├─GroupList.vue ----------------------------------- 群列表
|   |    └NewFriend.vue ------------------------------------ 朋友申请
|   ├─chat ------------------------------------------------- 聊天目录
|   |  ├─Chat.vue ------------------------------------------ 聊天页面
|   |  ├─ChatInfo.vue -------------------------------------- 聊天信息
|   |  ├─User.vue ------------------------------------------ 好友详情
|   |  └UserSetting.vue ------------------------------------ 好友设置
├─mock ----------------------------------------------------- 模拟数据
├─config --------------------------------------------------- 配置js
├─components ----------------------------------------------- 组件
|     ├─chat ----------------------------------------------- 聊天组件目录
|     |  └ChatFooter.vue ----------------------------------- 聊天消息栏组件
├─api ------------------------------------------------------ 接口js