快捷導(dǎo)航

項(xiàng)目開發(fā)中husky的使用詳解

更新時(shí)間：2022年11月28日 15:16:55 作者：空山與新雨

這篇文章主要為大家介紹了項(xiàng)目開發(fā)中husky的使用詳解，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進(jìn)步，早日升職加薪

前言

在做個(gè)人項(xiàng)目的時(shí)候遇到一個(gè)需求，要在編完代碼之后代碼提交之前生成一個(gè)預(yù)覽文件，手動(dòng)執(zhí)行腳本難免會(huì)遺漏。然后就想到之前在工作中使用過的husky，正好拿過來用一用；

husky是什么？

husky是一個(gè)給git增加 hooks 工具

打開文檔發(fā)現(xiàn)husky的版本已經(jīng)更新到8.x了，這時(shí)候就照著新的步驟來一遍：

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

npm pkg set scripts.prepare="husky install"
// 在package.json的scripts字段中添加prepare鉤子，使用npm install的時(shí)候會(huì)自動(dòng)執(zhí)行 npm run prepare 相當(dāng)于執(zhí)行husky install, 優(yōu)化了初始化流程
// 需要注意的是，npm pkg set是 npm v7才有的命令，如果不支持就手動(dòng)添加，也挺簡(jiǎn)單。

npx husky add .husky/pre-commit "npm run xxx"
// 創(chuàng)建hook，執(zhí)行之后會(huì)在項(xiàng)目的目錄中添加.husjy目錄，并增加pre-commit鉤子，鉤子中會(huì)添加一段腳本；接下來就要手動(dòng)添加其他命令，比如我增加了如下代碼

npm run generate
git add .

如此在提交代碼之前就先執(zhí)行g(shù)enerate命令，然后使用git add .將代碼添加到git倉(cāng)庫(kù)的緩存區(qū)，最后會(huì)跟隨著項(xiàng)目代碼一起提交到代碼倉(cāng)庫(kù)。

舊版本v4和當(dāng)前版本的區(qū)別

在4.x之前，安裝husky過程中它會(huì)自動(dòng)在.git/hooks目錄下增加一系列的鉤子，每個(gè)鉤子里都有調(diào)用husky的程序。當(dāng)git操作的時(shí)候觸發(fā)git鉤子就會(huì)自動(dòng)調(diào)用husky程序，然后按照package.json的配置執(zhí)行程序。( husky 版本≤4.x 在package.json中增加配置)

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

在4.x之后，有所變化，安裝過程不會(huì)在.git/hooks目錄下創(chuàng)建鉤子，而是會(huì)修改.git/config 文件：增加hooksPath字段。然后按照需求手動(dòng)來增加hook，比如執(zhí)行npx husky add .husky/pre-commit "npm test"會(huì)增加一個(gè)鉤子，同時(shí)在項(xiàng)目根目錄自動(dòng)創(chuàng)建的.husky/pre-commit文件。

新版本的優(yōu)點(diǎn)是不需要在package.json配置，畢竟package.json是不能寫注釋的，可讀性要差許多，代碼靈活性也差許多。

以上就是項(xiàng)目開發(fā)中husky的使用詳解的詳細(xì)內(nèi)容，更多關(guān)于項(xiàng)目開發(fā)husky使用的資料請(qǐng)關(guān)注腳本之家其它相關(guān)文章！

您可能感興趣的文章: