[TOC]
写在前面：
commitizen：使用git cz代替git commit，引导用户填写规范的commit信息husky + commitlint：git commit动作时，校验commit信息，如果不满足commitizen规范，则无法提交
一、安装husky依赖
pnpm i husky -D
husky依赖安装完成后，执行npx husky install，初始化husky;
通过以下命令来创建pre-commit:
npx husky add .husky/pre-commit "npx eslint --ext .ts,.js,.vue --ignore-path .gitignore ."
通过以下命令安装lint-staged依赖:
pnpm i lint-staged -D
安装完成后，进入到pre-commit文件，修改以下代码
npx lint-staged
然后进入到package.json文件配置命令lint-staged：
// 1、在"scripts"中加入下面三行代码
"lint": "eslint --ext \".ts,.js,.vue\" --ignore-path .gitignore .",
"lint:fix": "eslint --ext \".ts,.js,.vue\" --ignore-path .gitignore . --fix",
"precommit": "lint-staged"
// 2、然后再下面的代码与"scripts"同级
"config": {
"commitizen": {
"path": "node_modules/cz-customizable"
}
},
"husky": {
"hooks": {
"pre-commit": "lint-staged"
}
},
"lint-staged": {
"*.{js,ts,vue}": [
"eslint --fix",
"git add"
]
}
此时，如果提交代码的话，会显示不规范。接下来配置commitizen + cz-customizable
二、配置commitizen
commitizen 是一个 cli 工具，用于规范化 git commit 信息，可以代替 git commit
首先安装commitizen依赖
pnpm i commitizen cz-conventional-changelog cz-customizable -D # 安装规范化提交插件
创建并配置.cz-config.js文件(该文件和package.json文件同级即可)，其内容如下：
module.exports = {
// type 类型
types: [
{ value: 'feat', name: 'feat: 引入新功能' },
{ value: 'fix', name: 'fix: 修复 bug' },
{ value: 'style', name: 'style: 更新 UI 样式文按键' },
{ value: 'format', name: 'format: 格式化代码' },
{ value: 'docs', name: 'docs: 添加/更新文档' },
{ value: 'perf', name: 'perf: 提高性能/优化' },
{ value: 'init', name: 'init: 初次提交/初始化项目' },
{ value: 'test', name: 'test: 增加测试代码' },
{ value: 'refactor', name: 'refactor: 改进代码结构/代码格式' },
{ value: 'patch', name: 'patch: 添加重要补丁' },
{ value: 'file', name: 'file: 添加新文件' },
{ value: 'publish', name: 'publish: 发布新版本' },
{ value: 'tag', name: 'tag: 发布新版本' },
{ value: 'config', name: 'config: 修改配置文件' },
{ value: 'git', name: 'git: 添加或修改.gitignore 文件' }
],
// allowTicketNumber: false,
// isTicketNumberRequired: false,git
// ticketNumberPrefix: 'TICKET-',
// ticketNumberRegExp: '\\d{1,5}',
// 可以设置 scope 的类型跟 type 的类型匹配项，例如: 'fix'
// scopeOverrides: {
// config: [
// { name: 'merge' },
// { name: 'style' },
// { name: 'e2eTest' },
// { name: 'unitTest' }
// ]
// },
// 覆写提示的信息
messages: {
type: "选择你要提交的类型:",
// scope: '\n选择一个 scope (可选):',
// 选择 scope: custom 时会出下面的提示
// customScope: '请输入自定义的 scope (可选):',
subject: '填写一个简短精炼的描述语句 (必填):\n',
body: '添加一个更加详细的描述，可以附上新增功能的描述或 bug 链接、截图链接 (可选)。使用 "|" 换行:\n',
breaking: '列举非兼容性重大的变更 (可选):\n',
footer: '列举出所有变更的 ISSUES CLOSED (可选)。 例如.: #31, #34:\n',
confirmCommit: '确认提交?（y/n）',
},
// 是否允许自定义填写 scope ，设置为 true ，会自动添加两个 scope 类型 [{ name: 'empty', value: false },{ name: 'custom', value: 'custom' }]
allowCustomScopes: false,
allowBreakingChanges: ['feat', 'fix'],
// 跳过问题
// skipQuestions: ['body', 'footer'],
// subject 限制长度
subjectLimit: 100,
// breaklineChar: '|', // 支持 body 和 footer
// footerPrefix : 'ISSUES CLOSED:'
// askForBreakingChangeFirst : true,
};
具体配置内容请根据项目所需进行配置，官方网址
配置commitlint
首先安装commitlint：
pnpm i @commitlint/cli @commitlint/config-conventional -D
然后创建并配置commitlint.config.js，内容如下
module.exports = {
// 继承规则
extends: ['@commitlint/config-conventional'],
// 定义规则
rules: {
'type-enum': [
2,
'always',
[
'feat',
'fix',
'style',
'format',
'docs',
'perf',
'init',
'test',
'refactor',
'patch',
'file',
'publish',
'tag',
'config',
'git',
],
],
'type-case': [0],
'subject-empty': [0],
'type-empty': [0],
'scope-empty': [0],
'scope-case': [0],
'subject-full-stop': [0, 'never'],
'subject-case': [0, 'never'],
'header-max-length': [0, 'always', 72],
},
}
具体配置内容请根据项目所需进行配置，官方网址
最后通过一下命令创建commit-msg
npx husky add .husky/commit-msg "npx --no-install commitlint --edit $1"
三、测试
最后利用git cz进行测试即可
