在前端项目开发中我们经常会使用git管理项目,但是在过程中,我们有时会遇到commit信息不规范导致查看历史提交时不能一眼明了,或者在拉下代码时,碰到很多代码格式上的冲突。今天主要介绍下如何利用git的钩子解决这些问题。

首先我们来了解下常用的钩子

  • pre-commit 这个钩子会在commit命令时调用,通常会用来检查本次代码提交的风格,如果不符合会退出提交,也可以通过--no-verify跳过代码检查
  • commit-msg 通常用来验证提交信息是否符合规范
  • post-commit 在提交完成后执行,可以用来查看本次提交信息
  • pre-push 会在git push时调用

其实钩子有很多,上面只是列举常用的,在项目.git/hooks文件夹里我们会看到很多钩子,只要有需要都可以拿来用

接下来我们通过安装 husky 来操作git hooks通过执行 npm i husky  -D或 yarn add husky -D 将其安装到项目依赖

然后启用husky 手动执行npx husky install

当然也可以设置为自动执行 npm set-script prepare "husky install" ,接下来你会在package.json中看到

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

这个命令会在npm install后自动执行

这步操作会在项目根目录生成.husky文件夹

启用后,我们可以就可以通过husky来添加钩子。

例如:npx husky add .husky/钩子名称  "需要添加的命令-cmd"

添加后我们就可以在.husky里看到有了对应的改变

那么重点来了 接下来我们如何通过钩子约束commit提交的信息呢?

我们可以通过安装commitlint. npm i -D @commitlint/cli @commitlint/config-conventional

然后添加到钩子里  npx husky add .husky/commit-msg "npx --no-install commitlint --edit $1" 

添加后我们就可以验证提交信息了,当然还需要告诉这个包通过什么规则验证提交信息,这点是必须的。规则配置详见官网:commitlint - Lint commit messagesLint commit messages!

如果想在提交时验证本次提交内容的格式

安装lint-staged -D

然后添加到钩子npx husky add .husky/pre-commit "npx lint-staged"

配置验证规则,这点同样是必须的

GitHub - okonet/lint-staged: 🚫💩 — Run linters on git staged files!


wxp686
44 声望1 粉丝