前端代码规范

CSS

命名要语义化
用类选择器，减少使用标签选择器：因为项目中重复的标签多了以后不好区分。可能有很多重复的标签，所以最好还是使用类选择器。
bem规范：

.block{}

.block__element{}

.block–modifier{}

CSS样式推荐书写顺序：
好的样式顺序，不仅看起来清晰，也可以提升浏览器渲染DOM的性能。
定位属性：position display float left top right bottom overflow clear z-index
自身属性：width height margin padding border background
文字样式：font-family font-size font-style font-weight font-varient color
文本属性：text-align vertical-align text-wrap text-transform text-indent text-decoration letter-spacing word-spacing white-space text-overflow
css3中新增属性：content box-shadow border-radius transform……

TS

只有当前文件要用的类型可以放在当前文件，多个文件公用的可以在父文件里建一个types.ts来存放。原因：避免类型重复定义，代码量冗长。
类型文件没有默认导出，每个类型需要一个一个export。

脚手架

单独业务代码结构命名：以todo list为例，在src/pages下面新建一个文件夹，命名为todolist，再去写相关的业务代码。而不是放在src/pages/home下面。
组件命名也要语义化。
目录结构：
目录规范：App里要写页面整个框架的结构

VScode自动格式化

在vs code设置里，setting.json里添加这行代码：

"editor.codeActionsOnSave": {
		"source.fixAll": true,
		"source.fixAll.eslint": true,
		"source.fixAll.stylelint": true
	},
1
2
3
4
5

就可以在每次保存以后自动格式化代码