hzzzzzzzq / Blog

这是我记录博客的地方,希望能多写一些技术博客,JS、ES、React、Vue等
14 stars 0 forks source link

Git 系列 - 3. 格式化commit命令 #17

Open hzzzzzzzq opened 2 years ago

hzzzzzzzq commented 2 years ago

commit 格式化 husky(V7.0.4)让我们的 commit 更规范

这里我们来说一下为什么我们做一个 git commit 的格式化。 我们来看看 commit log 做格式化之前的样子。 1C3B682E-04B3-49C6-8136-0F8288F552D1

我们再来看看 commit log 格式化之后的样子。 image

对比格式化前和格式化后的感觉, 是不是很清晰,也可以让别人看得懂你在做什么,在多人协作开发时,是特别重要的。

在开始文章之前,我来说一下我使用的 nodenpm 版本。

12.0.1 - macOS Monterey

v16.4.2 - node

7.24.0 - npm

husky(v7.0.4

husky 是一个可以让配置 git 钩子变得更加简单的工具。

# 安装
yarn add husky -D
# 或者
npm install husky --save-dev
# 启动
npm set-script prepare "husky install"

这时会在 package.json 文件中看到下面的代码,说明执行成功。

"scripts": {
  "prepare": "husky install"
}

当然这里可能有人可能会执行下面的命令,并且报错 set-script 找不到,改用 npm 就可以了。

yarn set-script prepare "husky install"
# error Command "set-script" not found

或者可以直接跳过启动,手动去修改 package.json 文件,在 scripts 中添加 "prepare": "husky install" 语句,然后执行 husky install 命令。

执行之后会增加一个 .husky 的文件夹。

image

# 安装 lint-staged
yarn add lint-staged -D
# 安装 eslint
yarn add eslint prettier -D

package.json 文件中需要添加下面的代码

"lint-staged": {
  "src/**/*.{js,jsx,ts,tsx,json}": [
    "prettier --write",
    "eslint",
    "git add"
  ]
},
yarn add @commitlint/cli @commitlint/config-conventional -D
# 命令创建
echo "module.exports = {extends: ['@commitlint/config-conventional']}" > commitlint.config.js

也可以手动创建,然后添加内容。

module.exports = {
  extends: ['@commitlint/config-conventional'], // 以下时我们自定义的规则
  rules: {
    'type-enum': [
      2,
      'always',
      [
        'feat', // 新功能(feature)
        'fix', // 修补 bug
        'docs', // 文档(documentation)
        'style', // 格式(不影响代码运行的变动)
        'refactor', // 重构(即不是新增功能,也不是修改bug的代码变动)
        'test', // 增加测试
        'merge', // 合并分支
      ],
    ],
  },
};
# 添加 commit-msg
yarn husky add .husky/commit-msg 'yarn commitlint --edit "$1"'
# 添加 pre-commit
yarn husky add .husky/pre-commit 'yarn lint-staged --allow-empty "$1"'

这之后我们可以来看看 .husky 文件现在的样子

image

# 添加内容
git add .
# 提交commit
git commmit -m "feat: 优化git commit"

image

到这里我们就完成啦,当然,如果你的 commit log 格式,不符合自己添加的 rules 那么就会在 commit 时提交失败,这时候就需要你修改 commit log 的格式了。