与 commit messages 相关介绍

[Devancn]

前言

讲如何使用 commitizen 之前，先介绍一下一些前置知识和项目中常用到的 npm 包

Git Hook

Git 钩子就是特定事件发生时 Git 自动运行的普通脚本，脚本不一定是 shell 脚本，任何解释执行的语言都可以作为运行的脚本，只要指定执行的解释程序就行 ，比如 Node 程序的脚本 开头声明为 #!/usr/bin/env node就可以执行。

在打开仓库的 .git/hooks目录中会看到下面这些文件:

applypatch-msg.sample       pre-push.sample
commit-msg.sample           pre-rebase.sample
post-update.sample          prepare-commit-msg.sample
pre-applypatch.sample       update.sample
pre-commit.sample

这里包含了大部分 Git 可用的钩子， 但是也 .sample 扩展名放置他们被执行，只要去掉 .sample扩展名就可以或者从新写一个以 Git Hook 为命名的脚本。

husky

在了解了 Git Hook 基本概念后，我们可以基于 Git Hook 做一些代码校验，单元测试等等。但是发现 Git Hook 脚本是放在 .gi/hooks 这个目录中的， 也就是说它不会被 Git 所进行管理，这样在多人协作和维护就比较麻烦。 所以 husky 可以解决这个问题，现在 husky@5 是最新版本，但是目前大家用的基本都是 husky@4 的版本，如果想从4升级至5可以自行查看下husky官网操作步骤。下面是 husky@4 使用步骤：

1. 安装 husky v4为开发依赖

npm i husky@4 -D

2. 在 package.json 中配置 hooks, 如在运行 git commit时输出 Hello Devan字符串

   {
    "husky": {
       "hooks": {
         "pre-commit": "echo \"Hello Devan\""
       }
     }
   }

commitlint

从字面就能看出它的作用，没错！就是检查用户的 commit messages（提交说明），commit messages 也有一些约定规范，比如 Angular 的约定规范类型有: build、ci、chore、docs、feat、fix、perf、refactor、revert、style、test。commitlint的 commit message 规范是可扩展的，所以它需要开发者自定义一些 commit message 规范或者使用社区已经开源提供的约定规范。如下演示如何使用常用的约定规范 commit/config-conventional

1. 安装 commitlint cli 和 conventional config 为开发依赖

    npm i  @commitlint/config-conventional @commitlint/cli -D

2. 在项目根目录添加 commitlint.config.js文件

   {
      extends: ['@commitlint/config-conventional']
   }

3. 校验 commit message 是否符合 config-conventional 约定

    npx  commitlint --edit $1

   可以在用户输入提交信息之后被调用的钩子 message-msg来进行 commit 校验

    "husky": {
       "hooks": {
         "commit-msg": "commitlint -e $HUSKY_GIT_PARAMS"
       }
     }

lint-staged

这个也是从字面上也能看出它的作用。 git add files 是把工作目录中文件加入的 stage 缓存，lint-staged 就是对缓存中的文件进行一些比如使用 eslint 进行代码修复等操作。使用方式：

1. 添加 lint-staged 为开发依赖

   npm i lint-staged -D

2. 在 package.json 文件中添加配置

   {
     "lint-staged": {
       "文件匹配规则": "shell 脚本"
     }
   }

commitizen

简单来说就是根据用户使用的commit messages规范以交互式的方式来格式化你的 commit messages。使用方式：

1. 安装 commitizen 依赖

   npm i commitizen --save-dev

2. 使用适配器 cz-conventional-changelog 来初始化提交给范类型

   npx commitizen init cz-conventional-changelog --save-dev --save-exact

3. 在 package.json 配置规范

   "config": {
       "commitizen": {
         "path": "cz-conventional-changelog"
       }
   }

4. 使用方式有以下几种方式

   • git cz - 需要用户全局安装 commitizen

   • npx cz - 本质是执行项目中 node_modules/.bin/cz shell 脚本，和 package.json 文件中：

     "script": "cz"

     执行过程一致

   • 使用 Git prepare-commit-msg钩子，每次调用 git commit命令是都会触发给钩子

     "husky": {
       "hooks": {
         "prepare-commit-msg": "exec < /dev/tty && git cz --hook || true",
       }
     }

   以上只是简单初步了解，如果想要了解更多可以查看对应文档，实际个人觉得如果用了commitizen 就没必要再用 commitlint 。

   参考

   https://github.com/commitizen/cz-cli

   https://github.com/typicode/husky/tree/master

   https://github.com/conventional-changelog/commitlint

   https://www.conventionalcommits.org/en/v1.0.0-beta.2/#why-use-conventional-commits

   https://github.com/okonet/lint-staged

   https://git-scm.com/docs/githooks