代码规范工具（四）Husky+lint-staged+commitlintHusky lint-staged commi

Husky

用于在提交或推送时，自动化检查提交信息、检查代码和运行测试

官网地址：typicode.github.io/husky/zh/

lint-staged

用于在提交代码前对项目进行lint，避免提交了不规范或者错误的代码

官网地址：github.com/lint-staged…

commitlint

用于检测git提交的message是否符合规范，如果不符合规范则提交失败。

官网地址：commitlint.js.org/

安装

#npm
npm i -D husky lint-staged @commitlint/cli @commitlint/config-conventional @commitlint/prompt-cli
#yarn
yarn add -D husky lint-staged @commitlint/cli @commitlint/config-conventional @commitlint/prompt-cli
#pnpm
pnpm add -D husky lint-staged @commitlint/cli @commitlint/config-conventional @commitlint/prompt-cli
#bun
bun add -D husky lint-staged @commitlint/cli @commitlint/config-conventional @commitlint/prompt-cli

配置

配置husky，确保已经初始化git仓库，执行以下命令：

npx husky init

执行完项目根目录会生成 .husky目录

project
├─.husky
│   └─_
│   │  ├─.gitignore
│   │  └─husky.sh
│   │
│   │─pre-commit

package.json会自动修改，用于安装依赖时自动启用git钩子

{
    "scripts": {
        ...
        "prepare": "husky"
    }
}

添加lint-staged配置到package.json，前提是已经安装了eslint、prettier、stylelint，根据需求去修改配置:

{
    ...
    "lint-staged": {
        "*.{ts,tsx,js,jsx,cjs,mjs,vue}": "eslint --fix",
        "*.{vue,css,scss,less,styl}": "stylelint --fix",
        "*.{ts,tsx,js,jsx,cjs,mjs,vue,css,scss,less,styl,md,html}": "prettier --write"
    }
}

将 .husky/pre-commit改为以下内容

npx lint-staged

在项目根目录下创建 .commitlintrc.js：

module.exports = { extends: ['@commitlint/config-conventional'] };

在 .husky创建commit-msg

npx --no -- commitlint --edit ${1}

修改package.json

{
	"scripts": {
        ...
    	"commit": "commit"
	}
}

使用

因为配置了lint-staged，git提交前会使用eslint、prettier、stylelint检查是否有错误代码，没有错误才可继续提交
代码没有错误继续提交会通过commitlint校验提交信息格式，格式如下
```
<type>(<scope>): <subject>
<body>
<footer>
```
type只有以下选项：

feat：新功能

fix：Bug修复

docs：仅文档修改

style：不影响代码含义的更改（空格、格式、缺少分号等）

refactor：既不修复错误也不添加功能的代码更改

perf：提高性能的代码更改

test：添加丢失的测试或更正现有测试

build：影响构建系统或外部依赖关系的更改

ci：更改我们的CI配置文件和脚本

chore：其他不修改src或测试文件的更改

revert：恢复以前的提交

可以使用命令快速生成提交信息并直接执行git提交操作
```
#npm
npm run commit
#yarn
yarn commit
#pnpm
pnpm commit
#bun
bun commit
```