mirror of
https://github.com/NohamR/knowledge-kit.git
synced 2026-05-25 12:27:15 +00:00
64 lines
2.3 KiB
Markdown
64 lines
2.3 KiB
Markdown
## 前端工程化与 CI、CD
|
||
|
||
首先明确，这个话题很大，所以文章篇幅特别长，所以拆分成多个部分进行记录。
|
||
|
||
|
||
|
||
### 用 husky 和 lint-staged
|
||
|
||
1. 什么是 lint？
|
||
|
||
|
||
> In computer programming, lint is a Unix utility that flags some suspicious and non-portable constructs (likely to be bugs) in C language source code; generically, lint or a linter is any tool that flags suspicious usage in software written in any computer language. The term lint-like behavior is sometimes applied to the process of flagging suspicious language usage. Lint-like tools generally perform static analysis of source code.
|
||
|
||
上面是[维基百科](https://en.wikipedia.org/wiki/Lint_%28software%29)的定义。 **Lint 就是对代码进行静态分析，并试图找出潜在问题的工具。**
|
||
|
||
|
||
2. Lint 的好处，有以下三点：
|
||
|
||
- 可以让代码更加阅读性良好
|
||
- 具有更高的开发效率。工程师会花 50% 时间去做问题定位和解决 bug，其中很多错误是低级的，而 lint 可以很容易定位发现这些低级错误
|
||
- 可以让代码存在更少 Bug。
|
||
|
||
|
||
3. Lint 的反馈链条太长
|
||
|
||
假如 lint 是在 ci、cd 的后续步骤则会发现整个反馈流程太长，所以应该是 commit 之前做 lint。CI 流程做 lint 的缺点：Lint 在整个开发工作流中反馈链条太长，浪费时间
|
||
|
||
4. 所以有工具可以做这个事情。
|
||
lint-staged、husky 允许你在代码提交的时候做掉 eslint。commitlint 可以让你在提交的时候将 commit message 写的规范，
|
||
```json
|
||
"dependencies": {
|
||
"eslint": "^6.7.2",
|
||
"lint-staged": "^9.5.0",
|
||
"mocha": "^6.2.2"
|
||
},
|
||
"script": {
|
||
"test": "NODE_ENV=development jest",
|
||
"lint": "eslint . --fix --format codefrane"
|
||
},
|
||
"devDependencies": {
|
||
"@commitlint/cli": "^8.2.0",
|
||
"@commitlint/config-conventional": "^8.2.0",
|
||
"husky": "^3.1.0"
|
||
},
|
||
"husky": {
|
||
"hooks": {
|
||
"pre-commit": "lint-staged",
|
||
"commit-msg": "commitlint -E HUSKY_GIT_PARAMS"
|
||
}
|
||
},
|
||
"lint-staged": {
|
||
"**/*.js": [
|
||
"eslint --fix --cache --format=pretty",
|
||
"git add"
|
||
]
|
||
}
|
||
```
|
||
关键词： commitlint、lint-staged
|
||
|
||
|
||
### 前端代码风格自动化系列
|
||
|
||
|