Git Commit 优化.png

前言：在使用git提交代码过程中，git commit的规范常不被大多数人注意，然而版本管理工具中，代码的提交规范对项目的后续维护有着很重要的作用。故本文从以下几个方面展开述说工程开发中git commit优化的几个工具：

  • commitizen：简单的 commit 规范
  • cz-conventional-changelog：执行会将项目npm发布新版本，并自动生成CHANGELOG.md文件
  • commitlint：格式校验工具
  • husky：Git的钩子，在此作用为代码的提交规范和规范的校验
  • standard-version：辅助 cz-conventional-changelog 打 version 等功能

    commitizen和cz-conventional-changelog

    下载cz-conventional-changelog commitizen
    1. cnpm i -D commitizen cz-conventional-changelog
    package.json添加配置信息
    1. "scripts": {
    2. ...,
    3.   "commit": "git status && git add . && git-cz",
    4. },
    5. ,
    6. "config": {
    7.   "commitizen": {
    8.     "path": "node_modules/cz-conventional-changelog"
    9.   }
    10. }
    image.png
    成功提交之后
    image.png

Commitlint及husky

  1. cnpm i -D husky @commitlint/config-conventional @commitlint/cli

项目根目录新建commitlint.config.js

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

package.json添加如下

  1. # package.json
  3. ...,
  4. "husky": {
  5.     "hooks": {
  6.       "commit-msg": "commitlint -E $HUSKY_GIT_PARAMS"    }
  7. }

执行命令 npm run commit

  1. 1.Select the type of change that you're committing 选择改动类型 (<type>)
  3. 2.What is the scope of this change (e.g. component or file name)? 填写改动范围 (<scope>)
  5. 3.Write a short, imperative tense description of the change: 写一个精简的描述 (<subject>)
  7. 4.Provide a longer description of the change: (press enter to skip) 对于改动写一段长描述 (<body>)
  9. 5.Are there any breaking changes? (y/n) 是破坏性修改吗？默认n (<footer>)
  11. 6.Does this change affect any openreve issues? (y/n) 改动修复了哪个问题？默认n (<footer>)

生成如下格式

  1. <type>(<scope>): <subject>
  2. <BLANK LINE>
  3. <body>
  4. <BLANK LINE>
  5. <footer>

image.png
其中各自含义为

  • scope 指 commit 的范围（哪些模块进行了修改）
  • subject 指 commit 的简短描述
  • body 指 commit 主体内容（长描述）
  • footer 指 commit footer 信息
  • type 指当前 commit 类型，一般有下面几种可选类型：
  1. # 主要type
  2. feat:     增加新功能
  3. fix:      修复bug
  5. # 特殊type
  6. docs:     只改动了文档相关的内容
  7. style:    不影响代码含义的改动，例如去掉空格、改变缩进、增删分号
  8. build:    构造工具的或者外部依赖的改动，例如webpack，npm
  9. refactor: 代码重构时使用
  10. revert:   执行git revert打印的message
  12. # 暂不使用type
  13. test:     添加测试或者修改现有测试
  14. perf:     提高性能的改动
  15. ci:       与CI（持续集成服务）有关的改动
  16. chore:    不修改src或者test的其余修改，例如构建过程或辅助工具的变动

standard-version: 自动生成 CHANGELOG

下载插件

  1. cnpm i --save-dev standard-version

package.json添加如下

  1. {
  2.   "scripts": {
  3.     "release": "standard-version"
  4.   }
  5. }

执行npm run release，在根目录会生成CHANGELOG.md文件
image.png

总package.json

  1. {
  2.   "name": "web-learn-notes",
  3.   "version": "1.1.0",
  4.   "description": "web学习笔记仓库",
  5.   "main": "index.js",
  6.   "scripts": {
  7.     "commit": "git status && git add . && git-cz",
  8.     "release": "standard-version",
  9.     "test": "echo \"Error: no test specified\" && exit 1"
  10.   },
  11.   "repository": {
  12.     "type": "git",
  13.     "url": "git+https://github.com/wztlink1013/web-learn-notes.git"
  14.   },
  15.   "keywords": [
  16.     "web",
  17.     "学习",
  18.     "笔记"
  19.   ],
  20.   "author": "wztlink1013",
  21.   "license": "ISC",
  22.   "bugs": {
  23.     "url": "https://github.com/wztlink1013/web-learn-notes/issues"
  24.   },
  25.   "homepage": "https://github.com/wztlink1013/web-learn-notes#readme",
  26.   "devDependencies": {
  27.     "@commitlint/cli": "^16.0.0",
  28.     "@commitlint/config-conventional": "^16.0.0",
  29.     "commitizen": "^4.2.4",
  30.     "cz-conventional-changelog": "^3.3.0",
  31.     "husky": "^7.0.4",
  32.     "standard-version": "^9.3.2"
  33.   },
  34.   "config": {
  35.     "commitizen": {
  36.       "path": "node_modules/cz-conventional-changelog"
  37.     }
  38.   },
  39.   "husky": {
  40.     "hooks": {
  41.       "commit-msg": "commitlint -E $HUSKY_GIT_PARAMS"
  42.     }
  43.   }
  44. }