关于前端:commitmessage规范和实施

对立格局的提交记录，更清晰和易读
能够通过提交记录来理解本次提交的目标，更好的 CR 和重构
更容易理解变更，定位和发现问题
每个提交形容都是通过思考的，改善提交品质
生成变更记录

通过 commit-message 标准评审，在业界罕用的：atom，eslint 和 Angular 等标准中, 能够抉择最罕用的 Angular 标准作为咱们日常我的项目中的提交标准

每条提交记录蕴含三个局部：header,body 和 footer

<header> <BLANK LINE> <body> <BLANK LINE> <footer>

Commit Message Header

<type>(<scope>): <short summary>
  │       │             │
  │       │             └─⫸ Summary in present tense. Not capitalized. No period at the end.
  │       │
  │       └─⫸ Commit Scope: animations|bazel|benchpress|common|compiler|compiler-cli|core|
  │                          elements|forms|http|language-service|localize|platform-browser|
  │                          platform-browser-dynamic|platform-server|router|service-worker|
  │                          upgrade|zone.js|packaging|changelog|dev-infra|docs-infra|migrations|
  │                          ngcc|ve
  │
  └─⫸ Commit Type: build|ci|docs|feat|fix|perf|refactor|test

其中 <type> 和 <summary> 是必要的 <scope> 是可选的

feat: 新增页面或性能
fix: bug 修复
build: 影响构建零碎或内部依赖项的更改
ci: 对 CI 配置文件和脚本的更改
docs: 文档改变
perf: 性能晋升改变
refactor: 不影响性能的代码重构 (既不修复谬误也不增加性能)
test: 增加或批改测试用例

通过 commitizen 进行交互式提交，husky + commit-msg hook 进行提交校验，cz-customizable 来自定义交互提交流程和文案

装置 commitizen

npm i -D commitizen

package.json 中增加对应的 npm script

"commit":"cz"

改变增加到暂存区后执行 commit 提交

npm run commit

装置 husky , commitlint 和合乎 angular 提交标准的配置

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

增加 git hooks

npx husky install

package.json 中增加 prepare 的 npm hook, 在每次 install 主动执行 (yarn v2+ 不反对 prepare)

"prepare": "husky install"

执行增加 commit-msg hook

如果应用 husk v4.x 版本 (举荐降级到新版本)，间接在 package.json 中或.huskyrc.json 中新增 commit-msg 钩子即可

package.json

"husky": {    
    "hooks": {"commit-msg": "commitlint --edit $1"}  
}

.huskyrc，.huskyrc.json，.huskyrc.js 或 husky.config.js

"hooks": {"commit-msg": "commitlint --edit $1"}

如果应用 husky v6+ 版本，须要增加对应的 shell 调用形式（husky v6 对增加形式做了改变，所以无奈通过增加配置到 package.json 中运行）

npx husky add .husky/commit-msg 'npx --no-install commitlint --edit $1'

增加 commintlint 配置 (也能够放到 package.json 中指定)

echo "module.exports = {extends: ['@commitlint/config-conventional'] };" > commitlint.config.js

package.json 中增加 commitlint 配置

"commitlint": {    
  "extends": ["@commitlint/config-conventional"]
}

commitizen 提供的交互式默认是英文的，如果改成中文或者对交互流程进行改变，能够应用 cz-customizable 进行扩大和自定义

装置 cz-customizable

npm i -D cz-customizable

package.json 中增加配置

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

.cz-config.js 就是 cz-customizable 配置的具体文件了，能够参考 CZ-Config-Example 并进行改变, 能够把文案翻译成中文，自定义批改提醒等。

也能够通过 fork cz-customizable 创立内封配置文件的 npm 包

npm i -D your-own-package

"config": {    
  "commitizen": {"path": "node_modules/your-own-package"} 
}

配置文件能够自定义交互内容，比方能够只保留 type scope breakchange confirm

抉择提交类型
简略形容本次改变
是否有重大变更
确定提交

配置文件中设置 skipQuestions: [‘body’,’customScope’,’scope’,’footer’]，即可疏忽其余选项

allowBreakingChanges: [‘feat’, ‘fix’], 仅在 feat 和 fix 时提醒 breakchange

通过 npm script 进行 commit，如果 eslint 没有通过 (在 pre-commit 钩子中做了 eslint 检测)，然而又想提交能够通过加 ’––’ 来向 npm script 传参

npm run commit -- --no-verify # or npm run commit -- -n

关于前端:commitmessage规范和实施

1.commit-message 标准必要性

2. 标准选型

3.Angular 的 Commit Message 标准简介

Type 必须是以下的类型

Summary 用来提供更改的简洁形容

4. 标准施行

1. 应用 commitizen 工具，在 commit 时能够交互的形式抉择 type

2. 通过 husky 在 git hooks 中对不符合规范的提交进行拦挡，拦挡 commitlint 进行校验

3. 扩大和自定义标准

4. 其余