Git提交规范

1. 场景

针对于git提交不规范，commit描述不清晰等问题进行插件约束

例如：

bad:

git add .
git commit -m "开发"

根据Angular JS 提交规范地址戳这里

格式：

<type>[optional scope]: <description>

[optional body]

[optional footer(s)]

----------翻译------------
<类型>[可选 范围]: <描述>

[可选 正文]

[可选 脚注]

正确的提交规范应如下：

good:

git add .
git commit -m 
"docs[登录授权]: 修改了登录授权的文档

将文档中的公司授权修改为企业授权

解决了第99个ISSUE"

2.解决方案

使用插件约束其提交规范

环境：

Node v14.15.1

npm 8.5.0

使用插件：

commitizen@4.2.5

cz-customizable@6.9.1

@commitlint/cli@17.0.3

@commitlint/config-conventional@17.0.3

husky@4.3.8

注：commitizen和cz-customizable均适用最新版本，husky高版本存在兼容性问题，使用4.3.8版本

配置过程

commitizen与cz-customizable

安装命令 npm i commitizen cz-customizable -D

安装完成后在package.json中增加配置项

  "config": {
    "commitizen": {
      "path": "node_modules/cz-customizable"
    }
  }

增加自定义配置文件

在项目根目录创建 .cz-config.js

可自定义配置项，模板：

/*
 * @Description: 
 * @Version: 
 * @FilePath: /cz-test/.cz-config.js
 * @Author: 黄小林
 * @Date: 2022-08-01 11:13:31
 * @LastEditTime: 2022-08-01 11:25:44
 */
module.exports = {
  // 可选类型
  types:[
    {value:'feat',name:'feat: 新功能'},
    {value:'fix',name:'fix: 修复'},
    {value:'docs',name:'docs: 文档变更'},
    {value:'style',name:'style: 代码格式(不影响代码运行的功能)'},
    {value:'refactor',name:'refactor: 重构'},
    {value:'perf',name:'perf: 性能优化'},
    {value:'test',name:'test: 增加测试'},
    {value:'chore',name:'chore: 构建过程或辅助工具的变动'},
    {value:'revert',name:'revert: 回退'},
    {value:'build',name:'build: 打包或新版本发布'},
  ],
  // 消息步骤
  messages:{
    type:'请选择提交的类型: ',
    customScope:'请输入修改的范围(可选)',
    subject:'请简要描述提交(必填)',
    body:'请输入详细描述(可选)',
    footer:'请输入要关闭的issue(可选)',
    confirmCommit:'确认要使用以上信息提交?(y/n)'
  },
  subjectLimit:72
}

安装完成后使用命令：git cz检查是否配置正确

如出现以下配置项，证明配置成功

ligoudandeMacBook-Pro:cz-test ligoudan$ git cz
cz-cli@4.2.4, cz-customizable@6.9.1

All lines except first will be wrapped after 100 characters.
? 请选择提交的类型:  (Use arrow keys)
❯ feat: 新功能 
  fix: 修复 
  docs: 文档变更 
  style: 代码格式(不影响代码运行的功能) 
  refactor: 重构 
  perf: 性能优化 
  test: 增加测试 
(Move up and down to reveal more choices)

2.husky

安装命令：

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

npm i husky@4.3.8 -D

安装完成后在package.json中增加配置项

  "husky": {
    "hooks": {
      "commit-msg": "commitlint -E HUSKY_GIT_PARAMS"
    }
  }

在根目录创建文件commitlint.config.js

可自定义配置项，模板：

/*
 * @Description: 
 * @Version: 
 * @FilePath: /cz-test/commitlint.config.js
 * @Author: 黄小林
 * @Date: 2022-08-04 14:49:14
 * @LastEditTime: 2022-08-05 10:51:13
 */
module.exports = {
  extends: ["@commitlint/config-conventional"],
  rules: {
    "type-enum": [
      2,
      "always",
      [
        "feat", // 新功能
        "fix", // 修复
        "docs", // 文档变更
        "style", // 代码格式(不影响代码运行的功能)
        "refactor", // 重构
        "perf", // 性能优化
        "test", // 增加测试
        "chore", // 构建过程或辅助工具的变动
        "revert", // 回退版本
        "build", // 打包或新版本发布
      ]
    ]
  }
};

配置完毕

完整package.json文件

{
  "name": "cz-test",
  "version": "0.1.0",
  "private": true,
  "scripts": {
    "serve": "vue-cli-service serve",
    "build": "vue-cli-service build",
    "lint": "vue-cli-service lint"
  },
  "dependencies": {
    "core-js": "^3.6.5",
    "vue": "^3.0.0"
  },
  "devDependencies": {
    "@commitlint/cli": "^17.0.3",
    "@commitlint/config-conventional": "^17.0.3",
    "@vue/cli-plugin-babel": "~4.5.15",
    "@vue/cli-plugin-eslint": "~4.5.15",
    "@vue/cli-service": "~4.5.15",
    "@vue/compiler-sfc": "^3.0.0",
    "babel-eslint": "^10.1.0",
    "commitizen": "^4.2.5",
    "cz-customizable": "^6.9.1",
    "eslint": "^6.7.2",
    "eslint-plugin-vue": "^7.0.0",
    "husky": "^4.3.8"
  },
  "eslintConfig": {
    "root": true,
    "env": {
      "node": true
    },
    "extends": [
      "plugin:vue/vue3-essential",
      "eslint:recommended"
    ],
    "parserOptions": {
      "parser": "babel-eslint"
    },
    "rules": {}
  },
  "browserslist": [
    "> 1%",
    "last 2 versions",
    "not dead"
  ],
  "config": {
    "commitizen": {
      "path": "node_modules/cz-customizable"
    }
  },
  "husky": {
    "hooks": {
      "commit-msg": "commitlint -E HUSKY_GIT_PARAMS"
    }
  }
}

前端项目增加提交规范校验

Git提交规范

1. 场景

2.解决方案

2.husky