关于husky+lint-staged代码规范

(Updated: )
问题&总结 › vue

一.husky

文档：https://typicode.github.io/husky/#/?id=install

1.安装配置

安装老版本husky4.x:

1
npm install husky@4.3.8 lint-staged --dev

配置：

1
2
3
4
5
6
7
8
9
10
{
  "husky": {
    "hooks": {
      "pre-commit": "lint-staged"
    }
  },
  "lint-staged": {
    "*.js": "yarn lint"
  }
}

git commit时触发pre-commit钩子，运行lint-staged命令，对*.js执行eslint命令。lint要在scripts提前配置好

husky新版本

1.安装

1
npm install husky --save-dev

2.使git hooks生效

1
npx husky install

3.在安装后自动启用 git hooks

1
npm set-script prepare "husky install"
1
2
3
4
5
6
// package.json
{
  "scripts": {
    "prepare": "husky install"
  }
}

也可以手动添加prepare
若是使用yarn 安装则需要将prepare换成postinstall， 见husky文档

4.创建一个precommit hook

1
2
3
npx husky add .husky/pre-commit "npm run lint" 
# 执行完之后在 .husky 目录下会多一个 pre-commit 的文件，里面的 npm run lint 就是这个 hook 要执行的命令，后续要改也可以直接改这个文件。
git add .husky/pre-commit

提交代码

1
git commit -m "feat(husky): test"

如果npm run lint失败会自动停掉代码提交并给出错误提示信息
lint的是全部文件，校验很慢，如果需要校验暂存文件，需要使用lint-staged

二.lint-staged

1.安装

1
npm install lint-staged --save-dev

2.配置

1
2
3
4
5
{
  "lint-staged": {
    "*.{js,vue}": "npm run lint"
  }
}

3.设置precommit运行为lint-staged

1
npx husky add .husky/pre-commit "npx lint-staged"

或者手动修改.husky/pre-commit

三.uninstall husky

1
npm uninstall husky && git config --unset core.hooksPath