学习Vue2 Commitizen规范，探索变更日志自动化

由于公司今年不再采购vue2nes，而是成立一个专家小组独立维护vue2。目前不仅参与而且作为牵头人，所以正在全力学习，特别是Vue2代码库里透露的各类知识点。本次探索变更日志自动化。

一、为什么需要自动化变更日志？

在维护大型开源项目（如 Vue2）时，变更日志（CHANGELOG）是连接开发者与使用者的关键纽带。手动维护变更日志存在三大痛点：

信息遗漏：开发者可能忘记记录某些重要修改。
版本混乱：多分支开发时容易产生版本冲突。
格式不一：不同开发者记录风格差异导致可读性下降。

以 Vue2 仓库为例，其官方 CHANGELOG 包含 2000+ 条变更记录，完全依靠人工维护几乎不可能。

二、自动化方案核心：规范化的提交信息

2.1 Conventional Commits 规范

Vue2 团队采用的提交信息格式：

xml 复制代码

<类型>(<作用域>): <主题>  
// 空行  
<正文>  
// 空行  
<页脚>

标准类型示例：

feat: 新功能（对应 CHANGELOG 的 Features）
fix: Bug 修复（对应 CHANGELOG 的 Bug Fixes）
perf: 性能优化
chore: 构建/工具变更

2.2 Vue2 真实提交示例

通过 Git 命令查看最近的提交记录：

bash 复制代码

git log --pretty=format:"%h - %s" -n 3  
# 输出示例：  
a6e8c5a - fix(compiler): handle v-if with template v-for  
4f6b3d2 - feat(runtime): add config.optionMergeStrategies  
9b2c8f1 - chore: upgrade dev dependencies

三、完整实现流程

3.1 工具链配置（以 Vue2 为例）

安装必要的工具：

bash 复制代码

npm install -D commitizen conventional-changelog-cli husky

3.2 提交规范强制校验

配置 Git 钩子（Husky）和提交规则：

创建提交校验钩子文件 .husky/commit-msg：

bash 复制代码

#!/bin/sh  
npx --no-install commitlint --edit "$1"

配置提交规则文件 commitlint.config.js：

javascript 复制代码

module.exports = {  
  extends: ['@commitlint/config-conventional'],  
  rules: {  
    'type-enum': [2, 'always', ['feat', 'fix', 'docs', 'style', 'refactor', 'test', 'chore', 'perf', 'revert']]  
  }  
};

3.3 自动生成变更日志

在 package.json 中配置脚本：

json 复制代码

{  
  "scripts": {  
    "release": "standard-version",  
    "changelog": "conventional-changelog -p angular -i CHANGELOG.md -s"  
  }  
}

执行命令生成日志：

bash 复制代码

# 生成版本号并更新日志  
npm run release -- --release-as minor  

# 仅更新日志（不修改版本）  
npm run changelog

四、高级定制技巧

4.1 自定义日志模板

创建 .versionrc 文件，定义类型映射和链接格式：

json 复制代码

{  
  "types": [  
    {"type": "feat", "section": "Features"},  
    {"type": "fix", "section": "Bug Fixes"},  
    {"type": "perf", "section": "Performance Improvements"}  
  ],  
  "commitUrlFormat": "https://github.com/vuejs/vue/commit/{hash}",  
  "compareUrlFormat": "https://github.com/vuejs/vue/compare/{previousTag}...{currentTag}"  
}

4.2 关联 Issue 追踪

在提交信息中引用 GitHub Issue：

bash 复制代码

git commit -m "fix(runtime): memory leak in watchers  

closes #1234, #1235  
BREAKING CHANGE: remove deprecated API"

生成的日志效果：

markdown 复制代码

### Bug Fixes  
* **runtime:** memory leak in watchers (提交哈希链接)  
  - 关闭 #1234  
  - 关闭 #1235  

### BREAKING CHANGES  
* 移除已弃用的 API

Vue2的工程实践

5.1 版本发布流程

运行测试套件：npm run test:unit
生成构建产物：npm run build
更新变更日志：npm run release
推送带标签的提交：git push --follow-tags

5.2 多仓库同步策略

对于像Vue2这样包含核心库与子项目（vue-router、vuex等）的生态体系：

bash

csharp 复制代码

# 使用lerna管理多包
lerna version --conventional-commits
lerna publish from-package

五、Vue2 的工程实践

5.1 版本发布流程

运行测试套件：npm run test:unit
生成构建产物：npm run build
更新变更日志：npm run release
推送带标签的提交：git push --follow-tags

5.2 多仓库同步策略

对于 Vue2 生态中的子项目（如 vue-router、vuex），使用 Lerna 管理多包：

bash 复制代码

# 统一管理版本和发布  
lerna version --conventional-commits  
lerna publish from-package

六、常见问题解决方案

6.1 合并提交处理

处理 Merge pull request 类型的提交时，需调整提交规则：

javascript 复制代码

// commitlint.config.js  
rules: {  
  'subject-case': [2, 'never', ['sentence-case', 'start-case']]  
}

6.2 多语言支持

生成中文版变更日志：

bash 复制代码

conventional-changelog -p angular -i CHANGELOG.zh-CN.md -s -l zh

七、效果对比

手动维护 vs 自动化生成：

指标	手动维护	自动化生成
版本发布耗时	30 分钟以上	2 分钟以内
信息准确率	约 80%	100%
格式一致性	多版本差异	完全统一
Issue 追溯	需手动链接	自动关联

八、演进方向

AI 辅助生成：利用 GPT 模型优化变更描述的可读性。
可视化分析：生成变更影响图谱，直观展示代码演进路径。
安全审计：自动检测提交中的敏感信息（如 API 密钥）。