項目開發(fā)中husky的使用詳解
前言
在做個人項目的時候遇到一個需求，要在編完代碼之后代碼提交之前生成一個預(yù)覽文件，手動執(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 相當(dāng)于執(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和當(dāng)前版本的區(qū)別
在4.x之前，安裝husky過程中它會自動在.git/hooks目錄下增加一系列的鉤子，每個鉤子里都有調(diào)用husky的程序。當(dāng)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的使用詳解的詳細(xì)內(nèi)容，更多關(guān)于項目開發(fā)husky使用的資料請關(guān)注腳本之家其它相關(guān)文章！
相關(guān)文章
凡事有好就又壞，想必大家都知道Vue的作用與優(yōu)點，但是使用的規(guī)程中也總是有很多問題，接下來小編就來向大家講解使用Vue時應(yīng)注意的一些問題，希望能幫助到大家2021-09-09
這篇文章主要介紹了Vue中使用mixins混入方式,具有很好的參考價值,希望對大家有所幫助,如有錯誤或未考慮完全的地方,望不吝賜教2024-08-08
vue列表數(shù)據(jù)刪除后主動刷新頁面及刷新方法詳解
這篇文章主要給大家介紹了關(guān)于vue列表數(shù)據(jù)刪除后主動刷新頁面及刷新方法的相關(guān)資料，文中通過示例代碼介紹的非常詳細(xì)，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2021-05-05
Vue之解決Echarts組件使用ID不能復(fù)用的問題
這篇文章主要介紹了Vue之解決Echarts組件使用ID不能復(fù)用的問題,具有很好的參考價值,希望對大家有所幫助,如有錯誤或未考慮完全的地方,望不吝賜教2024-03-03
這篇文章主要介紹了 詳解vue微信網(wǎng)頁授權(quán)最終解決方案，小編覺得挺不錯的，現(xiàn)在分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2019-06-06
這篇文章主要為大家詳細(xì)介紹了Vue3批量異步更新是如何實現(xiàn)的，文中的示例代碼簡潔易懂，具有一定的借鑒價值，感興趣的小伙伴可以跟隨小編一起學(xué)習(xí)一下2023-08-08
這篇文章主要介紹了Vue文本模糊匹配功能如何實現(xiàn),文中通過示例代碼介紹的非常詳細(xì)，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值,需要的朋友可以參考下2020-07-07
這篇文章主要給大家介紹了關(guān)于Vue+element-ui添加自定義右鍵菜單的相關(guān)資料，文中通過示例代碼介紹的非常詳細(xì)，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2020-12-12
vue 實現(xiàn)模糊檢索并根據(jù)其他字符的首字母順序排列
這篇文章主要介紹了vue 實現(xiàn)模糊檢索，并根據(jù)其他字符的首字母順序排列,本文通過實例代碼給大家介紹的非常詳細(xì)，具有一定的參考借鑒價值，需要的朋友可以參考下2019-09-09
antd中table展開行默認(rèn)展示,且不需要前邊的加號操作
這篇文章主要介紹了antd中table展開行默認(rèn)展示,且不需要前邊的加號操作，具有很好的參考價值，希望對大家有所幫助。一起跟隨小編過來看看吧2020-11-11