项目规范
为了保证项目的顺利迭代，降低bug，良好的规范是项目的必备手段。本项目也有规范。
1.TypeScript规范
TsLint介绍
TsLint是校验TypeScript的工具，可以结合在vue cli中, 在本项目里，Tslint用来做语法风格校验。
TsLint和EsLint是类似的，但不同。本项目根目录下的tslint.json文件就是它的配置：
本项目的配置基于 tslint-config-alloy 第三方的规范，然后再覆盖了一些规范。
{
"defaultSeverity": "warning",
"extends": [
"tslint-config-alloy" #第三方库，这里用了腾讯alloy team的规则
],
"linterOptions": {
"exclude": [
"**/node_modules/**" # 排除的文件
]
},
#重置的配置
"rules": {
"import-spacing": false, # import之前的空格
"space-before-function-paren": false,
"whitespace": false,
"typedef-whitespace": false,
"jsdoc-format": false,
"no-implicit-dependencies": false,
"import-blacklist": true,
"ordered-imports": false, # 关闭import 规则
"no-console": false, #可以使用console.log
"no-consecutive-blank-lines": [ # 4个空格缩进
true,
2
],
"indent": [true, "spaces", 4], # 无效空行最多2行
"no-magic-numbers": false, #关闭禁用魔法数字规则
"linebreak-style": false, # 换行符号不限制
"interface-over-type-literal": false, # 可以使用type约定，而不是interface
"comment-format": [
false
],
"member-access": false, # 类成员可以不必须被标记为 public private 和 protected
"no-inferrable-types": [ # 类型推断允许写类型
true,
"ignore-params",
"ignore-properties"
],
"radix": false // tslint 可以不传第二个参数
}
}
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
总体来说： 一般有如下几条重要的规则：
- 表达式后面一定要写
;。 - 字符串用单引号包裹。
- 变量命令使用驼峰式命名。
- 一个tab对应4个空格。
- 使用全等===而不是==。
等等。
注意：如果你的规则不符合要求，控制台会提示你语法活样式错误警告，你最好在提交代码之前把错误警告按照提示 解决掉。
参考： alloy team 规范
2.HTML规范：
遵循驰展前端HTML的规范： 驰展前端HTML规范
3.SCSS/CSS规范：
遵循驰展前端CSS的规范： 驰展前端CSS规范
4.命名规范
文件夹命名： 小写， 首字母英文
文件命名：
ts文件：小写 ， 首字母英文， 驼峰命名法则
vue：小写 ， 首字母英文， 驼峰命名法则
vue组件： 首字母大写英文， Pascal命名法则