项目开发中husky的使用详解

前言

在做个人项目的时候遇到一个需求，要在编完代码之后代码提交之前生成一个预览文件，手动执行脚本难免会遗漏。然后就想到之前在工作中使用过的husky，正好拿过来用一用；

husky是什么？

husky是一个给git增加 hooks 工具

打开文档发现husky的版本已经更新到8.x了，这时候就照着新的步骤来一遍：

npm install husky --save-dev // 安装husky

npm pkg set scripts.prepare="husky install"
// 在package.json的scripts字段中添加prepare钩子，使用npm install的时候会自动执行 npm run prepare 相当于执行husky install, 优化了初始化流程
// 需要注意的是，npm pkg set是 npm v7才有的命令，如果不支持就手动添加，也挺简单。

npx husky add .husky/pre-commit "npm run xxx"
// 创建hook，执行之后会在项目的目录中添加.husjy目录，并增加pre-commit钩子，钩子中会添加一段脚本；接下来就要手动添加其他命令，比如我增加了如下代码

npm run generate
git add .

如此在提交代码之前就先执行generate命令，然后使用git add .将代码添加到git仓库的缓存区，最后会跟随着项目代码一起提交到代码仓库。

旧版本v4和当前版本的区别

在4.x之前，安装husky过程中它会自动在.git/hooks目录下增加一系列的钩子，每个钩子里都有调用husky的程序。当git操作的时候触发git钩子就会自动调用husky程序，然后按照package.json的配置执行程序。( husky 版本≤4.x 在package.json中增加配置)

{
    "husky": {
        "hooks": {
            "commit-msg": "commitlint -E HUSKY_GIT_PARAMS" // commit-msg是git hook
        }
    },
}

 在4.x之后，有所变化，安装过程不会在.git/hooks目录下创建钩子，而是会修改.git/config 文件：增加hooksPath字段。然后按照需求手动来增加hook，比如执行npx husky add .husky/pre-commit "npm test"会增加一个钩子，同时在项目根目录自动创建的.husky/pre-commit文件。

新版本的优点是不需要在package.json配置，毕竟package.json是不能写注释的，可读性要差许多，代码灵活性也差许多。