每时每课新项目流程

开发前准备：
1.观察项目图纸，脑海中模拟效果运行，缕清业务逻辑
2.列出简易点和困难点
难的 不会的 就查百度 查博客 问大牛 问群友
3.合理划分时间
4.根据要求选择框架和组件
5.创建公用库 私用库
（公用库中存放可复用的css样式和图片）
这里我选择的是vue脚手架 因为简单 方便 体积小 没有什么没用的组件
1.先搭建vue脚手架 配置eslint规范 创建git仓库 上传
2.写环境变量 开发，测试，生产
3.配置rem适配方案 37.5 因为vant使用的是375的标准
4.按需引入vant ui 组件
5.在vuex的action 把需要多次调用的接口传入 使用pormise封装接口axios
只需要调用一次的接口 写在页面内即可
使用临时本地存储，存储vuex数据 以防因刷新页面而导致数据丢失
6.使用vant的标签页组件 设为一级路由
7.创建首页页面 设为标签页的二级
重定向到二级首页
8.引入轮播组件 通过接口获取轮播图数据
每个功能块 都有一条以上的注释 方便后期维护和接手的人
9.获取列表数据 多数组赋值
10.写入样式 循环引入
11.使用link to页面跳转 到分类页面
12.分类页面请求数据渲染
13.引入vant下拉菜单自定义
14.绑定id 点击传值 确定请求接口 传输参数 获取到筛选后的值
15.登录页面 点击确认传输用户名和密码到接口 开始请求 获取到基础数据
16.获取后判断状态 code是否为200
17.如果为200 则临时保存在本地
18.在路由拦截器中 获取token 拼接 Bearer 规范 添加到请求头
19.然后跳转到用户页面
20.在用户页面 设定点击头部跳转事件 跳转到用户详情页面
21.点击信息 跳转新页面 请求对应的接口 数据双向绑定 输入框为原本的值
22.点击保存 put 传输绑定值 请求接口 发送修改请求 打印res的状态
23.如果失败 提示失败 不跳转页面
24.如果成功 提示成功并跳转回详情页
25.修改出生日期。引入vant的动作面板 开关绑定在出生日期所在的标签。
26.动作面板使用自定义 引入时间选择器 使用data格式 在取消和确定绑定关闭动作面板
27.点击确定关闭之前 获取已经选择的值 通过转码 转换成-连接的格式
28.之后通过put请求 传输转换后的格式到指定修改接口
29.项目功能完成 剩下时间 开始测试bug 上传git仓库
30.使用测试接口开始测试
31.记录bug以及解决方案
32.多次重现bug确保解决后 再次复查 以防因解决一个bug而导致出现其他bug
33.提交git仓库
34.配置打包优化
35过滤掉.map文件
36CDN加载
37.配置gzip压缩 压缩率在5-6倍左右 配置了静态gz加载后，浏览器也返回的是gz文件，这样就会请求小文件而不会导致请求卡线程
这里不使用图片压缩 因为图片不在本地 没有压缩的必要 并且 使用图片压缩回生成同大小的.gz文件 这样得不偿失
38.使用 HappyPack 来加速代码构建
HappyPack可以将原有的 webpack 对 loader 的执行过程，从单一进程的形式扩展多进程模式，从而加速代码构建
39.打包完成 部署到服务器
40.增加虚假后台管理路径