前端规范ESLint之Git工作流规范 Husky + lint-staged + commitlint（下篇）

前面Vue3+Vite2配置Eslint代码风格校验并自动补缺修复已经介绍了如何使用Eslint 和 Stylelint 来规范代码格式。但是有些开发人员会忽视这些错误和警告，直接将代码提交到代码仓库。这就会导致其他其他开发人员pull代码时可能会出现大段代码标红。下面介绍如何使用Husky + Commintlint + Lint-staged打造规范的Git检查工作流，确保我们的代码只有符合规范才能提交到代码仓库

一、Husky

git hook，也就是常说的Git钩子。husky官方文档，Git能在特定的重要动作发生时触发自定义脚本，使用husky可以挂载Git钩子，当我们本地进行git commit或git push等操作前，能够执行其它一些操作，比如进行ESLint检查，如果不通过，就不允许commit或push。其中，提交工作流钩子主要包括了以下四种，我们需要关注pre-commit和commit-msg钩子

• pre-commit：该钩子在键入提交信息前运行。 它用于检查即将提交的快照。如果该钩子以非零值退出，Git 将放弃此次提交，你可以利用该钩子，来检查代码风格是否一致。
• prepare-commit-msg：该钩子在启动提交信息编辑器之前，默认信息被创建之后运行。 它允许你编辑提交者所看到的默认信息。
• commit-msg：该钩子接收一个参数，此参数存有当前提交信息的临时文件的路径。 如果该钩子脚本以非零值退出，Git 将放弃提交，因此，可以用来在提交通过前验证项目状态或提交信息。
• post-commit：该钩子一般用于通知之类的事情。

安装

我这里安装的Husky是^8.0.0版本，新版本与旧版本的配置会有所不同

运行完会生成.husky文件夹，并在package.josn里添加如下命令（注意：该配置不是必须的）

生成pre-commit文件

在.husky文件夹下默认就有了一个pre-commit文件，这个文件是用来定义git commit之前应该执行什么命令，注意，该文件不是普通文本文件，必须通过上面命令生成，而不要手动去添加，win系统手动将下面代码复制到pre-commit文件中

二、lint-staged

默认情况下上面的命令会对所有的代码进行校验，这无疑是非常浪费时间的。这时候我们需要借助lint-staged(^13.0.3)来对暂存的 git 文件运行校验

安装

配置

在package.json里添加如下命令代码

也可以通过在根目录下创建.lintstagedrc文件，并在package.json > scripts下添加命令"lint-staged": "lint-staged"，该方式自行研究，个人认为直接写在package.json下更直观

Commitlint

在多人协作的背景下，git 仓库和 workflow 的作用很重要。而对于 commit 提