文章目录
  1. 1. 完整的提交格式:
  2. 2. 格式说明
    1. 2.1. 1、[type] 提交类型
    2. 2.2. 2、[message] 提交信息
    3. 2.3. 3、[*id] 需求/BUG 单号
  3. 3. git提交工具
  4. 4. git commit message 校验工具
  5. 5. 补充说明
  6. 6. 参考文档:

由于前公司的前端开发团队中git使用缺乏规范导致大家提交代码过于随意,排查日志非常麻烦,甚至常出现合丢代码的情况。于是受领导之托,制定了一些规范。这篇文章根据此规范整理而成

完整的提交格式:

[type]: [message][*id] (带*为选填)

格式说明

1、[type] 提交类型

  • add 添加文件、模块、组件、路由、插件、静态资源
  • fix 修复BUG
  • update 小范围修改、优化代码
  • refactor 大范围修改、重构

示例:
add: 供应商选择器组件
fix: 表单验证失效的问题

2、[message] 提交信息

必写,尽量一句话描述清楚。若有多项描述,用;分隔
示例:
update: 优化了A组件的实现方式;修改了B组件的样式

3、[*id] 需求/BUG 单号

若有需求或BUG单号,应加上单号,每个单号用【】包裹,便于追踪
fix: 这是一段描述【ID1008389】【ID1008389】
add: 实现了XXX需求【ID1008388】

PS: 如果团队使用JIRA,这样的格式是可直接在管理系统中追踪定位的

git提交工具

合理利用一些Git工具,有利于项目成员在使用git时的规范化。
首先,在项目中安装两个依赖

1
2
npm install cz-conventional-changelog --save-dev
npm install cz-customizable --save-dev

其次,修改package.json,添加config.commitizenscripts.cz字段,目的是自定义提交格式和可以快捷使用。如下所示:

1
2
3
4
5
6
"scripts": {
"cz": "git-cz"
},
"config": {
"commitizen": "node_modules/cz-customizable"
}

最后,在项目根目录创建.cz-config.js文件并制定规则:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
'use strict';

module.exports = {

types: [
{value: 'add',name: 'add: 添加文件、模块、组件、路由、插件、文档、静态资源'},
{value: 'update',name: 'update: 小范围修改、优化代码'},
{value: 'fix',name: 'fix: 修复BUG'},
{value: 'refactor',name: 'refactor: 大范围修改、重构'}
],

// // 修改范围。如果启用了messages的scope选项,则这里可以用得到
scopes: [
{name: '公用'},
{name: '模块1'},
{name: '模块2'}
],

// // 可覆盖特定提交类型的范围. Eg.: 'fix' test
/*
scopeOverrides: {
fix: [
{name: 'merge'},
{name: 'style'},
{name: 'e2eTest'},
{name: 'unitTest'}
]
},
*/
// override the messages, defaults are as follows
messages: {
type: '选择一种你的提交类型:',
scope: '选择修改范围 (可选):',
// used if allowCustomScopes is true
customScope: 'Denote the SCOPE of this change:',
subject: '短说明:\n',
body: '长说明(可选),使用"|"换行:\n',
breaking: '如果有非兼容性更新,请说明 (可选):\n',
footer: '关联关闭的issue(可选),例如:【ID1008389】【ID1008393】:\n',
confirmCommit: '确定**提交说明**?'
},
footerPrefix: '',
breakingPrefix: '【破坏性更新】',

allowCustomScopes: true,
allowBreakingChanges: ['refactor', 'fix', 'update'],

// limit subject length
subjectLimit: 100

};

可以根据自己团队的情况自行制定规则

运行npm run czyarn cz命令,就可以使用这个工具了:

命令行工具
命令行工具
命令行工具

提交后,生成出来的日志看起来是这个样子的:
效果

git commit message 校验工具

可以在项目中安装husky(git 钩子工具)+commitlint(校验提交信息)来阻止不合规的信息提交。
但出于种种原因我们的团队并没有强制使用这种校验,这里就不做深入研究,具体使用方法可以参考element-plus官方仓库。

补充说明

  1. 大范围改动须通知到其它成员
  2. 本地临时文件不要提交到项目中,可以在.gitignore文件中设置忽略
  3. 一次提交尽量只包含一个相关的改动
  4. 提交代码前先从远程仓库拉取最新代码并在本地合并,再提交本次的改动。两者有冲突时,建议先使用 git rebase 命令暂存本地修改,然后拉取代码,再处理冲突,最后提交。

参考文档:

  1. CZ工具集使用介绍
  2. element-plus官方仓库配置
  3. cz-customizable官方文档
文章目录
  1. 1. 完整的提交格式:
  2. 2. 格式说明
    1. 2.1. 1、[type] 提交类型
    2. 2.2. 2、[message] 提交信息
    3. 2.3. 3、[*id] 需求/BUG 单号
  3. 3. git提交工具
  4. 4. git commit message 校验工具
  5. 5. 补充说明
  6. 6. 参考文档: