vue

工欲善其事,必先利其器:使用commitlint+husky规范

2021-07-13  本文已影响0人  tianxiaoMCU

逛Github看到那些优秀项目美观、清晰的change log就很好奇怎么做到,直到……………………

commit格式介绍

美观、清晰的change log只要自己在commit的时候好好写就差不多了,但是在多人协作项目中就难以统一。如果有一个设计优秀、还有自动化工具支持的规范,那就再好不过了。
约定式提交正是这么一个规范,具体的内容请跳转到页面上阅读,内容不多,很简单。

通过git hook实现commit时检查格式

规范这东西,如非自觉,真是很难坚持。因此,有必要通过一些手段来强制去遵守。因此本文的重点就是搭建一个环境,让我们在commit时能自动的检查commit内容是否符合了上面的规范,并指出是哪些地方的问题。

首先,到Node.js官网下载并安装该环境(务必下载最新版,否则后续有命令执行会失败),安装时一路保持默认。安装结束在命令行窗口检查是否安装成功!

后续的所有操作都在项目的根目录执行!!!在项目根目录右键选择Git bash here进行操作。

创建package.json文件

执行npm init -y创建默认参数的package.json文件,不带-y则可以跟着提示一步步自定义各个参数,这里用默认的就够了。


安装commitlint

执行npm install --save-dev @commitlint/config-conventional @commitlint/cli,安装commitlint并下载commit风格文件,这里是@commitlint/config-conventional。还有别的规范文件,可以到github去看看哪个适合自己,当然也可以自定义。点这里
过去。


接着执行echo "module.exports = {extends: ['@commitlint/config-conventional']}" > commitlint.config.js创建风格指定文件。前面是下载,可以下载多个,通过配置文件指定使用其中一个,这里我就是用啥就只下载啥了。
执行完这两个指令,根目录下就会多了三个东西

安装husky

commitlint安装完就可以检测commit message是否符合规范了,不过是手动检查,明显不适合我这个懒人。所以需要再安装一个工具让git hook能在commit时触发去检查并给出错误信息。

  1. 执行npm install husky --save-dev命令,安装husky
  2. 执行npx husky install激活钩子
  3. 执行npx husky add .husky/commit-msg 'npx --no-install commitlint --edit "$1"'添加commit-msg钩子


测试

如图所示,不符合规范的commit信息会提示出错,并且指出了错误的地方。

一键执行脚本

新建txt文件,复制下面的内容进去,保存后将文件后缀改为.bat。将该批处理文件放到项目仓库根目录,双击执行,打完收工!

if not exist .git echo Please create a git repository first! & pause

call npm init -y

call npm install --save-dev @commitlint/config-conventional @commitlint/cli

echo module.exports = {extends: ['@commitlint/config-conventional']} > commitlint.config.js

call npm install husky --save-dev

call npx husky install

::call npx husky add .husky/commit-msg 'npx --no-install commitlint --edit "$1"'
echo #!/bin/sh > .husky\commit-msg
echo . "$(dirname "$0")/_/husky.sh" >> .husky\commit-msg
echo.  >> .husky\commit-msg
echo npx --no-install commitlint --edit "$1" >> .husky\commit-msg
pause
上一篇 下一篇

猜你喜欢

热点阅读