学习笔记

Appearance

Commit规范指南 ​

参考文章

背景 ​

Git 每次提交代码，都要写 Commit message（提交说明），提交内容也五花八门，不便于后续的项目阅读和管理。

优点 ​

  • 可读性好，清晰，不必深入看代码即可了解当前commit的作用。
  • 为 Code Reviewing做准备
  • 方便跟踪工程历史
  • 让其他的开发者在运行 git blame 的时候想跪谢
  • 方便生成修改日志(CHANGELOG.MD)

git blame => 查看文件的每一行是谁修改的

如下：查看 index.html中10行2列修改人

git blame -L 10,+2 index.html
git blame -L 10,+2 index.html

规范 ​

可以使用典型的Git工作流程或通过使用CLI向导Commitizen来添加提交消息格式。

使用界面：
image.png

安装 ​

推荐全局安装，项目中配置即可

bash
# 全局安装
pnpm install -g commitizen cz-conventional-changelog
# 全局安装
pnpm install -g commitizen cz-conventional-changelog

配置 ​

在package文件中，添加以下代码：

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

使用 ​

凡是用到git commit命令，一律改为使用git cz。

此时会出现这样的交互式命令行，根据提示完成提交

? Select the type of change that you're committing: (Use arrow keys)
❯ feat:        A new feature 
  fix:         A bug fix 
  improvement: An improvement to a current feature 
  docs:        Documentation only changes 
  style:       Changes that do not affect the meaning of the code (white-space, formatting, missing semi-colons, etc) 
  refactor:    A code change that neither fixes a bug nor adds a feature 
  perf:        A code change that improves performance 
(Move up and down to reveal more choices)
? Select the type of change that you're committing: (Use arrow keys)
❯ feat:        A new feature 
  fix:         A bug fix 
  improvement: An improvement to a current feature 
  docs:        Documentation only changes 
  style:       Changes that do not affect the meaning of the code (white-space, formatting, missing semi-colons, etc) 
  refactor:    A code change that neither fixes a bug nor adds a feature 
  perf:        A code change that improves performance 
(Move up and down to reveal more choices)

编辑器插件 ​

如果你使用的是webstorm，在plugin中搜索commit安装即可

image.png

到此就可以使用 git cz 来替换git commit了，
最后给你项目的README加上一个标识吧。

[![Commitizen friendly](https://img.shields.io/badge/commitizen-friendly-brightgreen.svg)](http://commitizen.github.io/cz-cli/)
[![Commitizen friendly](https://img.shields.io/badge/commitizen-friendly-brightgreen.svg)](http://commitizen.github.io/cz-cli/)

格式 ​

每次提交，Commit message 都包括三个部分：header，body 和 footer。

<type>(<scope>): <subject>
<BLANK LINE>
<body>
<BLANK LINE>
<footer>
<type>(<scope>): <subject>
<BLANK LINE>
<body>
<BLANK LINE>
<footer>

Header部分只有一行，包括三个字段：type（必需）、scope（可选）和subject（必需）。

  • 1.type

用于说明 commit 的类别，只允许使用下面7个标识。

commit类别 - 说明

    feat：    |  新功能（feature）
    fix：     |  修补bug
    docs：    |  文档（documentation）
    style：   |  格式（不影响代码运行的变动）
    refactor：|  重构（即不是新增功能，也不是修改bug的代码变动）
    test：    |  增加测试
    chore：   |  构建过程或辅助工具的变动    
    revert：  |  commit 回退
    feat：    |  新功能（feature）
    fix：     |  修补bug
    docs：    |  文档（documentation）
    style：   |  格式（不影响代码运行的变动）
    refactor：|  重构（即不是新增功能，也不是修改bug的代码变动）
    test：    |  增加测试
    chore：   |  构建过程或辅助工具的变动    
    revert：  |  commit 回退
  • 2.scope

scope用于说明 commit 影响的范围，比如数据层、控制层、视图层等等，视项目不同而不同。

  • 3.subject

subject是 commit 目的的简短描述，不超过50个字符。

Body ​

Body 部分是对本次 commit 的详细描述，可以分成多行。下面是一个范例。

Footer 部分只用于以下两种情况：

不兼容变动

关闭 Issue

commitlint 规范校验 ​

安装 ​

husky

  • 安装husky

通过特定的 git hook 来检查git提交信息，代码lint等功能

npm install --save-dev husky
npm install --save-dev husky
  • Activate hooks
npx husky install
npx husky install
  • package中新增 script
json
"prepare": "husky install"
"prepare": "husky install"

自动执行如上：husky install

  • 安装commitlint
pnpm install -D @commitlint/cli @commitlint/config-conventional
pnpm install -D @commitlint/cli @commitlint/config-conventional

添加配置 ​

package.json添加如下配置

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

使用 husky 命令在，创建 commit-msg 钩子，并执行验证命令：

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

添加标识 ​

[![Commitizen friendly](https://img.shields.io/badge/commitizen-friendly-brightgreen.svg)](http://commitizen.github.io/cz-cli/)
[![Commitizen friendly](https://img.shields.io/badge/commitizen-friendly-brightgreen.svg)](http://commitizen.github.io/cz-cli/)

无权问题 ​

image.png

chmod ug+x .husky/*
chmod ug+x .git/hooks/*
chmod ug+x .husky/*
chmod ug+x .git/hooks/*

tips ​

tips

提交校验失败时，发现修改的文件都消失了，不要慌，执行 git stash pop 操作即可恢复

自动版本管理和生成CHANGELOG ​

版本管理和CHANGELOG

完整的package.json ​

commitizen + cz-conventional-changelog + commitlint +standard-version

json
{
    "name": "blog",
    "version": "1.0.0",
    "description": "blog",
    "main": "index.js",
    "scripts": {
        "start": "npm run dev",
        "release": "standard-version",
        "release:alpha": "standard-version --prerelease alpha",
        "release:rc": "standard-version --prerelease rc",
        "release:major": "npm run release -- --release-as major",
        "release:minor": "npm run release -- --release-as minor",
        "release:patch": "npm run release -- --release-as patch"
    },
    "devDependencies": {
        "@commitlint/cli": "^17.6.6",
        "@commitlint/config-conventional": "^17.6.6",
        "commitizen": "^4.2.2",
        "cz-conventional-changelog": "^3.3.0",
        "standard-version": "^9.1.0"
    },
    "config": {
        "commitizen": {
            "path": "cz-conventional-changelog"
        }
    },
    "commitlint": {
        "extends": [
            "@commitlint/config-conventional"
        ]
    }
}
{
    "name": "blog",
    "version": "1.0.0",
    "description": "blog",
    "main": "index.js",
    "scripts": {
        "start": "npm run dev",
        "release": "standard-version",
        "release:alpha": "standard-version --prerelease alpha",
        "release:rc": "standard-version --prerelease rc",
        "release:major": "npm run release -- --release-as major",
        "release:minor": "npm run release -- --release-as minor",
        "release:patch": "npm run release -- --release-as patch"
    },
    "devDependencies": {
        "@commitlint/cli": "^17.6.6",
        "@commitlint/config-conventional": "^17.6.6",
        "commitizen": "^4.2.2",
        "cz-conventional-changelog": "^3.3.0",
        "standard-version": "^9.1.0"
    },
    "config": {
        "commitizen": {
            "path": "cz-conventional-changelog"
        }
    },
    "commitlint": {
        "extends": [
            "@commitlint/config-conventional"
        ]
    }
}
甘公网安备 号
Copyright © 2016 - 2023  forguo
总访问量， 总访客数
平台公约