項目開發(fā)中husky的使用詳解
前言
在做個人項目的時候遇到一個需求,要在編完代碼之后代碼提交之前生成一個預覽文件,手動執(zhí)行腳本難免會遺漏。然后就想到之前在工作中使用過的husky,正好拿過來用一用;
husky是什么?
husky是一個給git增加 hooks 工具
打開文檔發(fā)現(xiàn)husky的版本已經(jīng)更新到8.x了,這時候就照著新的步驟來一遍:
npm install husky --save-dev // 安裝husky
npm pkg set scripts.prepare="husky install" // 在package.json的scripts字段中添加prepare鉤子,使用npm install的時候會自動執(zhí)行 npm run prepare 相當于執(zhí)行husky install, 優(yōu)化了初始化流程 // 需要注意的是,npm pkg set是 npm v7才有的命令,如果不支持就手動添加,也挺簡單。
npx husky add .husky/pre-commit "npm run xxx" // 創(chuàng)建hook,執(zhí)行之后會在項目的目錄中添加.husjy目錄,并增加pre-commit鉤子,鉤子中會添加一段腳本;接下來就要手動添加其他命令,比如我增加了如下代碼
npm run generate git add .
如此在提交代碼之前就先執(zhí)行g(shù)enerate命令,然后使用git add .將代碼添加到git倉庫的緩存區(qū),最后會跟隨著項目代碼一起提交到代碼倉庫。
舊版本v4和當前版本的區(qū)別
在4.x之前,安裝husky過程中它會自動在.git/hooks目錄下增加一系列的鉤子,每個鉤子里都有調(diào)用husky的程序。當git操作的時候觸發(fā)git鉤子就會自動調(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之后,有所變化,安裝過程不會在.git/hooks目錄下創(chuàng)建鉤子,而是會修改.git/config 文件:增加hooksPath字段。然后按照需求手動來增加hook,比如執(zhí)行npx husky add .husky/pre-commit "npm test"會增加一個鉤子,同時在項目根目錄自動創(chuàng)建的.husky/pre-commit文件。
新版本的優(yōu)點是不需要在package.json配置,畢竟package.json是不能寫注釋的,可讀性要差許多,代碼靈活性也差許多。
以上就是項目開發(fā)中husky的使用詳解的詳細內(nèi)容,更多關(guān)于項目開發(fā)husky使用的資料請關(guān)注腳本之家其它相關(guān)文章!
相關(guān)文章
vue輪播組件實現(xiàn)$children和$parent 附帶好用的gif錄制工具
這篇文章主要介紹了vue輪播組件實現(xiàn),$children和$parent,附帶好用的gif錄制工具,需要的朋友可以參考下2019-09-09
VS?Code打開vue文件出現(xiàn)很多黃色波浪線的完美解決辦法
作為一名經(jīng)驗豐富的開發(fā)者,下面這篇文章主要給大家介紹了關(guān)于VS?Code打開vue文件出現(xiàn)很多黃色波浪線的完美解決辦法,文中通過圖文介紹的非常詳細,需要的朋友可以參考下2024-04-04
vue循環(huán)中調(diào)用接口-promise.all();按順序執(zhí)行異步處理方式
這篇文章主要介紹了vue循環(huán)中調(diào)用接口-promise.all();按順序執(zhí)行異步處理方式,具有很好的參考價值,希望對大家有所幫助。如有錯誤或未考慮完全的地方,望不吝賜教2023-07-07
淺析Visual Studio Code斷點調(diào)試Vue
本篇文章給大家總結(jié)了Visual Studio Code斷點調(diào)試Vue的方法以及心得分享,需要的朋友參考學習下。2018-02-02

