电脑看配置的代码

husky介绍

husky 是一个 git hook 工具，可以帮助我们在 git 操作之前与之后可设置自动执行的脚本，像：pre-commit、commit-msg、pre-push 等等支持的 git hooks。

那为什么不直接使用 git hook，而要使用 husky 呢？

原因很简单，git 自带的钩子需要在.git/hooks 目录中进行修改，而这里的文件并没有共享到代码库，无法和项目组成员共享。

配置步骤1pnpm   i   husky --devoryarnadd husky --dev配置 husky 自动安装

npm 脚本有 pre 和 post 两个钩子，以便于我们在执行npm install、npm publish、npm build等命令之前或之后执行脚本。 在这里我们添加 prepare 钩子，当执行完 npm install 后，将自动执行 husky install 初始化 husky 配置

"scripts": {"prepare": "npx husky install" }

添加 pre-commit hook

npx husky add .husky/pre-commit "npx eslint --fix packages/**/*.{ts,js,vue}"

执行完成后，就会在.husky 目录下生成 pre-commit 文件

这样当提交代码前，就会首先触发 pre-commit，自动执行 eslint 检查功能，并且后在校验失败时自动退出，这样可以确保本地的代码已经通过检查才能 push 到远程。

当然，如果你能确保你的代码没有任何问题又觉得 eslint 费时间，或者说这块代码是别人写的，为什么要我改，那么也可以直接跳过 husky。

git commit -m "XXX" --no-verifylint-staged的使用

在前面我们使用 husky 和 eslint 对提交前的代码进行检查时，可以看到我们项目里竟然存在 400 多个 eslint 问题，可是我只改了一个文件，难不成我要把所有的问题都给修复了？ 算了，还是采用--no-verify吧，让其他人去修。

真实项目开发中，基本都会遇到这个问题，我只改了 A 文件，结果全部文件的报错信息都冒了出来。

这时候我们就可以借助lint-staged对已经通过 git add 加入到 提交区 stage 的文件进行扫描即可。

npm install lint-staged --dev# use yarnyarn add lint-staged --dev

在 package.json 中配置 lint-staged

"lint-staged": {"packages/**/*.{js,jsx,ts,tsx,json,css,scss,md,vue}": ["eslint --fix --max-warnings=0"]},

这里我只开启 eslint 校验，防止代码再出现一些低级错误。

修改 pre-commit 钩子

#!/usr/bin/env sh. "$(dirname -- "$0")/_/husky.sh"# npx eslint --fix packages/**/*.{ts,js,vue}npx lint-staged

这样一来，当执行 git commit 命令提交代码时，会自动执行 husky 下的 pre-commit 脚本，即执行 lint-staged 命令。对暂存区文件执行 eslint 校验，而不是针对全部文件。

解决完这几个问题，就可以愉快的提交代码了。