为了前端代码形成统一的风格，制定该代码规范（该规范部分参照VUE官网介绍的风格指南以及常用的规范）
1. 文件夹命名
1.1以功能模块名称命名，能从文件夹名称中大致知晓该功能，文件夹以驼峰式规范书写
1.2 同一个功能模块中，文件统一放到该文件夹下（api文件除外，需要单独放到单独的文件夹下，方便维护）
2.VUE文件命名规范
2.1 功能性文件（.vue结尾）：开头统一采用大写，例如：HelloWorld.vue，同时文件名始终应该是多个单词组成，大致描述其功能，也是为了避免使用单个单词导致的文件冲突
2.2基础性组件（即可以在任意引用的组件，例如button等基础按钮）：全部以一个特定的前缀开头（开头统一采用大写）,同时需要采用多单词命名，例如：BaseButton.vue、BaseIocn.vue等
2.3 单例组件：命名规则遵循 （2.1） ，采用统一前缀开头：The（标识其唯一性），后面跟上功能描述，例：TheHeader.vue、TheFooter.vue（版本功能使用的button组件），该组件表示每个界面只能使用一次，同时不接受任何的 prop
2.4 紧密耦合的子组件：该类组件只在特定的父组件中使用，只有在该父组件中才有意义，命名时应该以父组件名作为前缀名称表示其两者关系，例如：TodoList.vue（父组件）、TodoListButton.vue（子组件）、TodoListSearch.vue（子组件）
3.JS文件命名规范
3.1普通js文件名始终为小写字母，当文件名称为多个单词组成时候，中间采用 "-"（中横线）隔开，例如：qrcode-login.js、utils.js、login.js
3.2api（定义接口文件）JS文件命名过程中，遵循上一条规则（3.1），同时名称需要尽量描述功能，采用统一结尾 -api，例如：user-api.js、official-content-api.js
4.具体文件中class命名方式
文件中定义class时，统一采用字母小写的方式，当class由多个单词组成，每个单词中间以 “-” 中横线分隔开，同时命名时注意其类名的唯一性，最好能描述该dom元素功能，防止冲突，例如：class="content-main-body"
（例外情况：当采用动态赋值class时，可采用驼峰式命名class，例如： ：class="{contentMain:contentFlag}"）
5.文件中方法名定义命名规范
5.1 今后方法定义统一采用：方法名：function(){}方式
5.2 在复用组件中、插件、混入等扩展中始终使用前缀名为 $_ 定义私有属性方法，用于回避和其他作者的冲突，例如：$_myGreatMinXin_update: function(){}
5.3 在普通功能界面中定义方法时采用驼峰式命名方法，开头尽量使用常用的单词，同时方法名称尽量能够描述该方法的功能，例如：getCommentListData: function(){}
6.图片命名方式
图片命名统一采用小写字母的方式，如果是多个字母，中间以 “-” 中横线隔开，同时图片名称应该描述具体使用场景，使代码使用者能够从图片名称中能够看出图片的使用位置以及图片大致内容，例如：official-content-detail-add-comment.png
7.常量、变量命名规范
7.1在定义常量时，采用全部大写的方式，多个单词之间采用 “_” 下划线分隔，例如：const APP_TITLE_TEXT = “app_title”;
7.2定义界面变量时，使用let定义
7.3impot引入js文件时，命名方式采用驼峰式命名，例如：impot appApi from ‘../../app-api.js’
8.接口api文件
为了方便统一管理，功能模块中使用的api接口统一写在一个js文件中,并放在指定的文件夹下，命名规范参照 （3.JS文件命名规范 3.2） ，然后再功能文件中引入该api的js文件，从而调取api接口
9.界面书写规范
9.1css样式书写规范：在书写界面css样式时，多使用class进行元素定位，少写或者不写大范围查询css（p、div等），同时尽量少用内联样式，此外也需少写id样式
9.2生命周期函数使用规范：在界面中，如果某个生命周期函数没有被使用到，则删除该函数，增加代码的简洁性
9.3当DOM元素有多个属性的时候，需要对属性进行换行处理，增加代码的可读性
9.4界面中生命周期函数之间、各个方法之间、DOM功能模块之间尽量增加一行空行进行分隔，使代码开起来更加容易区分模块、清晰（但是需要减少不必要的换行）
9.5界面中定义的方法、变量以及DOM功能模块追加注释，注明该模块功能点，变量定义使用场景，方法功能，尽量减少多余的未使用的定义
9.6VUE界面格式统一，统一使用<template></template>在前， <script></script> 在中间， <style></style>在末尾的方式
9.7代码格式化：统一采用tab缩进两字符的方式
9.8界面功能文件夹统一放在 /src/views 目录下（具体的其他目录另行定义）
9.9 界面引号、分号的使用：html、css代码中统一使用双引号（" "），js中统一使用单引号（' '），界面中分号不可省略（即使省略不影响界面正常功能）
10.通用方法
通用的方法统一放在一个文件中，例如：/src/utils/utils.js
11.注释规范
11.1 文件开头注释
/**
* Created by liushasha on 2018/11/14.
*/
11.2变量注释方式：
data() {
return {
funType: '1', //选项卡切换标识
publishData: [], //已发布数据列表
totalCount: 100, //总的数量
pageNum: 1, //记录当前页码
}
},
11.3 方法注释
/**
* 选项产生变化
* @param value
*/
userSelectChange(value) {
},
11.4 html界面注释
编辑
