husky使用

921 阅读3分钟

最近使用ant-design-pro 发现内部使用husky的钩子(pre-commit、commit-msg),去格式化修改的文件和限制git提交信息(需要按照一定严格的信息内容提交格式,才可以提交),因此对此进行相关了解学习

1、husky

Husky插件是一个基于Git版本控制系统的钩子(hooks)管理器,它允许你在Git操作(如提交代码、推送到远程仓库等)之前或之后运行自定义的脚本或命令。这些脚本可以用于自动化代码规范检查、运行测试、构建项目或执行其他定制化的任务。

Husky插件的主要功能是通过在Git钩子中注册自定义脚本来提供预操作和后操作的钩子。当你执行特定的Git操作时,Husky会触发相关的钩子,并运行你事先定义的脚本。这样可以确保代码在提交或推送到仓库之前通过各种验证和测试。

一些常见的用法包括:

  1. 代码规范检查:使用Husky插件,在提交代码之前运行代码格式化工具(如ESLint、Prettier等)来确保代码风格的一致性。
  2. 单元测试和集成测试:在推送代码之前运行自动化测试脚本,以确保代码的质量和功能的正确性。
  3. 构建和部署:在推送代码后自动触发构建过程,并将构建结果部署到相应的环境中。

通过使用Husky插件,可以在代码提交和推送的不同阶段自动执行各种任务,从而提高代码质量和开发效率。

请注意,这里所提到的Husky插件是一个通用的工具,与编程语言或开发环境无关。

2、husky简单使用钩子测试

npx init
npm install husky --save-dev
npx husky install
//添加钩子,使用版本是v8版本,只需要在.husky文件夹下配置钩子
npx husky add .husky/pre-commit
//在生成的文件夹里.husky\pre-commit,输入打印日志
#!/usr/bin/env sh
. "$(dirname -- "$0")/_/husky.sh"

echo \"[Husky] pre-commit\"
//git提交信息,就会看到对应日志输出
 git  commit -m "测试"

image.png

3、ant-design-pro 中 配合使用lint-staged

  • lint-staged: 在项目进行提交阶段时候,只对特定文件进行代码检查的工具 (被git add 提交到暂存区文件),避免对整个项目进行检查,这样可以大大减少代码检查的时间。
  • fabric verify-commit:统一团队 Git Commit 标准,便于后续代码 review、版本发布、自动化生成 change log。跟AngularCommit message 格式类似, 基本格式为 <type>(<scope>): <subject>注意:后面有个空格。 type,一般主要以下标识:
    • feat(模块): 添加了个很棒的功能
    • fix(模块): 修复了一些 bug
    • docs(模块): 更新了一下文档
    • UI(模块): 修改了一下样式
    • ...
    • test:增加测试
npm init
npm i prettier -D
npm i lint-staged -D
npm i @umijs/fabric -D //蚂蚁金服编码规范
//package.json文件设置
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1",
    "format": "prettier --write .",
    "lint-staged": "lint-staged"
  },
  "lint-staged": {
    "*.js": "prettier --write"
  },
  "devDependencies": {
    "@umijs/fabric": "^4.0.1",
    "husky": "^8.0.3",
    "lint-staged": "^10.5.4",
    "prettier": "^2.8.8"
  }
//配合前面步骤的husky,在pre-commit文件里输入
#!/usr/bin/env sh
. "$(dirname -- "$0")/_/husky.sh"

npm run lint-staged
//配合前面步骤的husky,在commit-msg文件里输入
#!/usr/bin/env sh
. "$(dirname -- "$0")/_/husky.sh"

# Export Git hook params
export GIT_PARAMS=$*

npx --no-install fabric verify-commit

测试:

1、新增a.js文件

        const a = 1;
const aa = {
                                          title: "a",
  description: "a",
};

2、同时更改package.json,在name前面加多个空格

              "name": "a",
  "version": "1.0.0",
  "description": "",
  "main": "index.js",
  "type": "module",

3、运行指令

git add .
git commit -m "测试"
//执行两个git钩子,一个是格式化,一个是消息提交
//最终a.js文件里内容会格式化,package.json文件没更新
//同时提交信息前面没有加type("feat: 测试"), 导致提交信息失败

image.png

参考

git-hook

lint-staged

husky

# Commit message 和 Change log 编写指南

fabric

verifyCommit