vue-cli-plugin-orange
1、准备工作
首先我们需要查看当前是否安装官方Vue/cli工具，若未安装，直接完成按官网指导下载最新版即可。
若Vue/cli版本低于3.0版本，需要升级版本才能实现以下功能。
Vue/cli工具官方地址：http://? https://cli.vuejs.org/zh/ ?
2、模板使用
克隆地址： git clone git@gitee.com:jqn-room/case-code.git#vue-cli-plugin-orange/master
模版库地址： https://gitee.com/jqn-room/case-code/tree/master/vue-cli-plugin-orange
3、配置项说明
（1）是否需要demo
（2）是否需要注入axios
4、结构说明 
（1） 集成`commitizen`规范提交message（中文提示信息），强制验证提交信息
（2） 集成`standard-version`自动生成changelog
（3） 使用`postcss-px-to-viewport`插件，vw适配移动端，基础宽度为750px，安卓缩放为1，iOS为2和3
@function vw($px, $isFontSize: 0) {@if $isFontSize == 1 {@return $px * 1px;}@return $px / 1920 * 100vw;}// 自动计算 750 屏幕的 rem
@function rem($px) {@return ($px / 32) * 1rem;
}
（4） 预设公司四个 env 环境以及四个 build scripts和serve scripts
（5） 使用`compression-webpack-plugin`进行资源 gzip 打包
（6） 使用`vconsole-webpack-plugin`集成 vconsole，生产环境默认关闭
（7） Service 层封装 axios，会根据
（8） 模块化 Vuex Store，集成了rootValye
（9） 集成了`yUI`组件
（10）集成了`yUtils`公用方法类
HTML5项目上线标准：
目标：
为了对HTML5项目进行管理，以提升安全、性能和用户体验，特制订此标准。标准从GIT库、代码、传输和构建等四个方面进行了规范约束，以期能让HTML5应用能在安全、性能和用户体验等方面上有所保障。
框架：
简单页可使用jQuery或zepto开发，复杂页面使用H5开发原型（vue 2.x框架+组件+自动化构建工具）开发
PC（vue 2.x框架+组件+自动化构建工具)
H5（vue 2.x框架+组件+自动化构建工具)
GIT库：
- 每个项目需有独立的GIT库存放，源码要存放在公司提供的GIT库，一个项目一套GIT库，GIT库不要多项目混合使用
- 经和运维沟通，GIT库中必须要有开发分支（dev）、测试分支(test)、准生产分支(pre)、生产分支(prod)
代码：
- 文件编码格式为UTF-8
- CSS文件引用和代码段 放head标签内，JS引用和代码段放文件尾，以提升页面展示速度
- 页面加载的多个小ICON需要合并成精灵图（sprint png）,以期减少多个HTTP请求建立开销
- 代码需要格式化，建议使用自动格式化工具。如Sublime的HTML/CSS/JS Prettify插件
- 逻辑判断条件需要用括号括起来，不使用A&&B的方式来替代if语句，以提高代码可阅读性
- 公司一般会创建H5站点，该H5站点一般会提供常用的公共文件，各应用遇到这些公共文件，应从H5站点加载。若项目所需的公共文件版本与公司H5站点提供公共文件版本不一致，项目应向公司H5站点的公共文件版本靠拢。以期最大化共享缓存。
传输：
- 页面的图片，单个文件不得超过200K(仅对移动端要求)
- 手机端网页首页首屏请求的数据量须小于1M
- 网络请求时需要有loading图标，若网络请求失败，则需要有重试机制
- 敏感信息（姓名、电话、卡号、身份证号、地址等）需要加密传输，对不同用户的加密key应不同
- 生产环境必须使用https协议进行传输
构建：
- 混淆。除框架等三方库外，业务代码必须混淆
- 合并。多个小文件（CSS、JS）需要合并为一个大文件，以减少加载时间
- 压缩。用自动化工具去除注释、空格、换行等，以减少文件体积
注：在测试环境为了方便BUG定位，可不进行混淆、合并和压缩。但在准生产环境、生产环境必须混淆、合并和压缩。