vue-SocialAPP
基于vue-cli3.0构建的一个社交H5平台
1、自适应方案通过postcss-px-to-viewport自动转换(vw实现自适应)
2、UI部分使用了mint-ui+colorUi
简介
1、无需自己手动转化rem(假设750的设计稿，一个元素在设计稿中宽度是300px, 我们在页面中直接写300px即可，将自动为转化为rem)
2、项目中使用摒弃Scoped使用CSS Modules模块化更合理(https://vue-loader.vuejs.org/zh/guide/css-modules.html)
3、封装了部分布局公用组件(文档：https://yinmrsir.github.io/vue-sociaApp-doc/index.html)
4、页面都是使用模块化开发形式，当无需页面中某部分功能时移除对应的模块即可
预览地址(建议使用谷歌按F12预览)：https://yinmrsir.github.io/vue-SocialApp/index.html#/
文件夹结构
├─ src // 代码编写的目录
│ ├─ assets // 静态文件
│ │ ├─ css // 公共css
│ │ └─ images // 图片文件
│ ├─ components // 公共组件(封装的公共组件并不只限于当前项目使用)
│ │ ├─ bottomModal
│ │ │ └─ bottomModal.vue // bottomModal组件
│ │ └─ index.js // 组件集合引用文件
│ ├─ mock // 定义模拟目录
│ │ └─ index.js // 接口模拟入口文件
│ ├─ view // 页面文件
│ │ ├─ components // 页面公用组件(只限于当前项目使用)
│ │ ├─ index
│ │ │ ├─ components // index页面组件
│ │ │ └─ index.vue // 首页
│ ├─ router.js // 路由定义
│ ├─ permission.js // 路由守卫权限控制
│ ├─ store.js // vuex配置
│ ├─ App.vue // 页面入口文件
│ └─ main.js // 程序入口文件
├─ .babel.config.js // ES6语法编译配置
├─ .gitignore // git 忽略项
├─ .postcssrc.config.js
├─ README.md // README
└─ package.json // 配置依赖
安装下载
快速使用
# 安装依赖
npm install
# 启动
npm run serve
# 编译
npm run build
交流 & 提问
QQ交流群: 411121858
提问：https://github.com/yinMrsir/vue-SocialApp/issues
关于vue-SocialAPP
对于当前项目只是用于学习交流，目前很多组件及页面还不够完善，欢迎大家提出宝贵的意见和建议，还有你们的star哦~