介紹

Git Husky 是一個可以管理 Git Hooks 的工具，它可以幫助我們在代碼提交的時候運行腳本，以確保代碼提交符合特定的規(guī)范和約定。

在 Git 中，允許在操作特定的事件時執(zhí)行特定的腳本，這些事件我們稱之為 Hooks。

Git Husky 利用這些 Hooks 實現(xiàn)了在代碼提交前、提交信息規(guī)范校驗等自動化運行腳本的功能。

安裝與配置

1、安裝

yarn add husky -D

首先我們需要在項目內(nèi)安裝 husky，并且初始化。

2、添加配置

npx husky install

執(zhí)行 npx husky install 將會生成 ./husky 的文件夾，在這里我們可以配置 Git Hooks 的腳本文件。

3、初始化

npm pkg set scripts.prepare="husky install"

執(zhí)行 npm pkg set scripts.prepare="husky install" 將會設(shè)置 prepare 的腳本，并將該腳本的執(zhí)行命令設(shè)置為 husky install，它將會在項目啟動時初始化 Git Husky。

4、添加 pre-commit hook

npx husky add .husky/pre-commit

執(zhí)行 npx husky add .husky/pre-commit 將會生成腳本 ./husky/pre-commit ，它會在 git commit 之前執(zhí)行腳本，如果腳本報錯的情況下將無法提交。

#!/usr/bin/env sh
. "$(dirname -- "$0")/_/husky.sh"

undefined

5、配置執(zhí)行腳本

在我們常用的場景中，我們需要在 git commit 之前對腳本進行代碼規(guī)范的檢測。

#!/usr/bin/env sh
. "$(dirname -- "$0")/_/husky.sh"

npm run lint

我們將命令修改以上配置，它將會在 git commit 之前執(zhí)行 npm run lint 命令來執(zhí)行 eslint 代碼檢測，如果檢測不通過將會拒絕提交。

當然你也可以通過 npx husky add .husky/pre-commit "npm run lint" 命令直接生成腳本。

7、添加 commit-msg hook

npx husky add .husky/commit-msg 'npx --no-install commitlint --edit "$1"'

commit-msg hooks 用于提交信息被保存之后運行。

8、commitlint 校驗

yarn add @commitlint/cli -D

我們通常使用 commitlint 工具對提交信息格式進行校驗，所以我們需要安裝 @commitlint/cli 。

9、常用配置

yarn add @commitlint/config-conventional -D

@commitlint/config-conventional 是一個符合提交信息規(guī)范的配置，我們可以直接使用。

在 @commitlint/config-conventional 的規(guī)范中，為我們提供了一下規(guī)則。

新建文件 commitlint.config.cjs 導入 @commitlint/config-conventional 規(guī)則。

module.exports = {
  extends: ['@commitlint/config-conventional'],
};

10、測試

git commit -m '修復了bug' // ×
git commit -m 'fix: 修復了bug' // √

通過分別執(zhí)行以上代碼我們發(fā)現(xiàn)，當提交的信息不符合規(guī)范時，Git Hooks 拒絕了我們的提交。

總結(jié)

Git husky 是一個 Git hooks 管理的工具，它可以幫助我們在代碼提交時運行腳本，確保代碼提交符合特定的規(guī)范和約定。

• 通過 husky 可以自動化地運行腳本，避免了手動操作的繁瑣性，提高了效率。

• 在代碼提交前、提交信息保存后等多個階段進行校驗和處理，保證了代碼質(zhì)量和規(guī)范性。

• 可以結(jié)合其他工具和規(guī)范進行使用，如 ESLint、Prettier、commitlint 等，增加了靈活性和可擴展性。

寫在最后

感謝你的閱讀~

如果你有任何的疑問歡迎您在后臺私信，我們一同探討學習！

如果覺得這篇文章對你有所幫助，點贊、在看是最大的支持！文章來源地址http://www.zghlxwxcb.cn/news/detail-434935.html

到了這里，關(guān)于配置 Git Husky 代碼提交約束的文章就介紹完了。如果您還想了解更多內(nèi)容，請在右上角搜索TOY模板網(wǎng)以前的文章或繼續(xù)瀏覽下面的相關(guān)文章，希望大家以后多多支持TOY模板網(wǎng)！