1、目录构建规则
1. 资源分类
1.1源代码资源：指开发者编写的源代码，包括html、css、template等。
1.2内容资源：指希望作为内容提供给访问者的资源，包括图片、字体、flash、pdf等，最常用的应该就是readme.md文件。
2. 具体规范
2.1 项目名称
全部采用小写方式,以以中线分隔分割
正例：project-name 反例：project_name-one/projectNameOne
2.2 目录命名
全部采用小写方式， 以中划线分隔，有复数结构时，要采用复数命名法， 缩写不用复数
正例： scripts/styles/components/images/utils/layouts/demo-styles/demo-scripts/img/doc
反例： script/style/demo_scripts/demoStyles/imgs/docs
【特殊】VUE 的项目中的 components 中的组件目录，使用 kebab-case命名。
正例： head-search/page-loading/authorized/notice-icon
反例：HeadSearch/PageLoading
【特殊】VUE 的项目中的除 components 组件目录外的所有目录也使用 kebab-case命名。
正例： page-one/shopping-car/user-management
反例： ShoppingCar/UserManagement
注：VUE组件的name属性最好设置下，方便开发过程中VUE Tools调试定位
2、 JS、CSS、SCSS、HTML、PNG 文件命名
全部采用小写方式， 以中划线分隔。
正例： render-dom.js/signup.css/index.html/company-logo.png
反例： renderDom.js/UserManagement.html
3、 命名严谨性
1.代码中命名严禁使用拼音与英文混合的方式，更不允许直接使用中文方式
说明：正确的英文拼写和语法可以让阅读者易于理解避免歧义
注：即使纯拼音命名方式也要避免采用（拼音缩写绝对不允许）
正例：henan/luoyang/rmb 等国际通用的名称，可视同英文
反例： DaZhePromotion [打折] / getPingfenByName() [评分] / int 某变量 = 3
2. 杜绝完全不规范的缩写，避免望文不知义：
反例： AbstractClass“缩写”命名成 AbsClass；condition “缩写”命名成 condi，此类随意缩写严重 降低了代码的可阅读性
4、HTML规范（VUE Template同样适用）
1. HTML类型
推荐使用 HTML5 的文档类型申明：
建议使用 text/html 格式的 HTML。避免使用 XHTML。XHTML 以及它的属性，比如 application/xhtml+xml 在浏览器中的应用支持与优化空间都十分有限
规定字符编码，IE兼容模式，DOCTYPE大写等（遵循w3c标准）
2. 缩进
缩进使用2个空格（一个Tab）；嵌套的节点应该有缩进
3. 分模块注释
每个块状元素，列表元素和表格元素后加上一对HTML注释
4.语义化标签
优先使用语义化标签（H5新增很多语义化标签）避免一个页面都是div或者p标签
正例：<header /> 或者 <footer/>
反例：<div><p></p></div>
5.引号
使用双引号（“”）而不是单引号（‘ ’）
正例：<div class=”box”></div class=”box”>
反例：<div class=’box’></div class=’box’>
注：能单标签结束尽量使用单标签结束（v-for 一定要设：key）
注：v-if不能和v-for同时使用，如果需要判断最好在数据中处理（js中处理）
5、 CSS规范
1.命名
A.类名使用小写字母，以中划线为分隔
B.Id采用小驼峰式命名
C.Scss/less中变量，函数混合，placeholder采用小驼峰式命名
ID 和 class 的名称总是使用可以反应元素目的和用途的名称，或其他通用的名称，代替表象和 晦涩难懂的名称
正例：.heavy{ font-szie:14px } .important{ color:green }
反例：.fw-800{ font-szie:14px } .green{ color:green }
2.选择器
A.Css选择器中避免使用标签名
从结构、表现、行为分离的原则来看，应该尽量避免 css 中出现 HTML 标签，并且在 css 选择 器中出现标签名会存在潜在的问题。
B.使用直接子选择器
很多前端开发人员写选择器链的时候不使用 直接子选择器（注：直接子选择器和后代选择器的
区别）。有时，这可能会导致疼痛的设计问题并且有时候可能会很耗性能。然而，在任何情况下，
这是一个非常不好的做法。如果你不写很通用的，需要匹配到 DOM 末端的选择器， 你应该总是考虑直接子选择器。
正例：.content > .title{ font-szie:14px }
反例：.content .title{ font-szie:14px }
3.尽量使用缩进属性
正例：padding：0 1px 2px；
反例：padding-bottom：2px；padding-left:1px; padding-right:1px;padding-top:0px
注：scss、less中可使用嵌套的样式写法尽量使用嵌套
4.样式写法规则
a. 不能写行内样式
b. 能用class处理的，别用js
c. 不要用id方式去写样式，尽量用class
d. 不要在全局使用过于普遍化的class(如：.content,.common，.text)或标签写全局样式
e. 记得写样式重置，但禁止用*去做样式重置的事情
f. 写css3样式动画，尽量避免位移属性去操作，如margin-top,left, right
6、JS规范
1.变量名：使用小驼峰式命名
2.运算符前后需要加空格
3.代码缩进两个空格（一个Tab）
4.语句规则
(1)简单语句的通用规则：一条语句通常以分号作为结束符
(2)复杂语句通用规则：
A.将左花括号放在第一行的结尾，并在左花括号前加空格
B.右花括号独立一行
C.不能以分号结束一个复杂声明
5.对象规则
(1)将左花括号与类名放在同一行
(2)冒号与属性值之间要有一个空格
(3)字符串使用双引号，数字不需要
(4)最后一个属性-值对（键值对）后边不要加逗号
(5)将右花括号独立放在一行，并以分号作为结束符
注：短对象代码可以直接写成一行
6.命名规则
(1)变量和函数为小驼峰法标识, 即除第一个单词之外，其他单词首字母大写（lowerCamelCase）
(2)全局变量为大写（UPPERCASE），多单词下划线分隔（APP_NAME）
(3)常量为大写（UPPERCASE），多单词下划线分隔（APP_NAME）
注：常量声明const，不能使用let；变量声明let，避免var出现
