前言

在使用 ant design pro 时，git 提交报错

> running commit-msg hook: fabric verify-commit

   ERROR  提交日志不符合规范

  合法的提交日志格式如下(emoji 和 模块可选填)：

     feat(模块): 添加了个很棒的功能

     fix(模块): 修复了一些 bug

     docs(模块): 更新了一下文档

     UI(模块): 修改了一下样式

     chore(模块): 对脚手架做了些更改

     locale(模块): 为国际化做了微小的贡献

    See .github/commit-convention.md for more details.

Angular 规范 是目前使用最广的写法，比较合理和系统化，并且有配套的工具。

ant design pro 内置了 fabric 作为了编码规范，fabric 提供了严格但是不严苛的 lint 规则集，包含 eslint，stylelint，prettier三种工具，可以显著的提升代码质量，规范代码风格。

有几种可以提交的方式：

  • 提交时忽略
git commit -a -m '提交语' --no-verify
  • 卸载插件，需要手动将引入包删除
  • 规范提交
  • vscode使用插件提交

规范 Commit message 的好处

在开发过程中，Git 每次提交代码，都需要写 Commit message（提交说明），规范的 Commit message 有很多好处：

  • 方便快速浏览查找，回溯之前的工作内容
  • 可以直接从 commit 生成 Change log (发布时用于说明版本差异)

目前我们并没有对 commit message 进行规范，造成以下麻烦：

  • 每个人风格不同，格式凌乱，查看很不方便
  • 部分 commit 没有填写 message，事后难以得知对应修改的作用

规范 Commit message 不仅能解决上述问题，而且基本没有副作用和学习成本，应该尽早加上。

规范使用

每次提交，Commit message 都包括三个部分：Header，Body 和 Footer。

Commit message 不能包含换行符，否则会报 ERROR 提交日志不符合规范

<type>(<scope>): <subject>

// 空一行

<body>

// 空一行

<footer>

其中，Header 是必需的，Body 和 Footer 可以省略。

不管是哪一个部分，任何一行都不得超过72个字符（或100个字符）。这是为了避免自动换行影响美观。

Header

Header部分只有一行，包括三个字段：type（必需）、scope（可选）和subject（必需）。

type

type用于说明 commit 的类别，只允许使用下面7个标识。

  • feat：新功能（feature）
  • fix：修补bug
  • docs：文档（documentation）
  • style： 格式（不影响代码运行的变动）
  • refactor：重构（即不是新增功能，也不是修改bug的代码变动）
  • test：增加测试
  • chore：构建过程或辅助工具的变动

如果 type 为 feat 和 fix，则该 commit 将肯定出现在 Change log 之中。其他情况（docs、chore、style、refactor、test）由你决定，要不要放入 Change log，建议是不要。

scope

scope用于说明 commit 影响的范围，比如数据层、控制层、视图层等等，视项目不同而不同。

subject

ubject是 commit 目的的简短描述，不超过50个字符。

  • 以动词开头，使用第一人称现在时，比如change，而不是changed或changes
  • 第一个字母小写
  • 结尾不加句号（.）

Body

Body 部分是对本次 commit 的详细描述，可以分成多行。下面是一个范例。

More detailed explanatory text, if necessary.  Wrap it to

about 72 characters or so. 

Further paragraphs come after blank lines.

- Bullet points are okay, too

- Use a hanging indent

有两个注意点。

（1）使用第一人称现在时，比如使用change而不是changed或changes。

（2）应该说明代码变动的动机，以及与以前行为的对比。

Footer

Footer 部分只用于两种情况。

不兼容变动

如果当前代码与上一个版本不兼容，则 Footer 部分以BREAKING CHANGE开头，后面是对变动的描述、以及变动理由和迁移方法。

BREAKING CHANGE: isolate scope bindings definition has changed.

    To migrate the code follow the example below:

    Before:

    scope: {

      myAttr: 'attribute',

    }

    After:

    scope: {

      myAttr: '@',

    }

    The removed `inject` wasn't generaly useful for directives so there should be no code using it.

关闭 Issue

如果当前 commit 针对某个issue，那么可以在 Footer 部分关闭这个 issue 。

Closes #234

也可以一次关闭多个 issue 。

Closes #123, #245, #992

Revert

还有一种特殊情况，如果当前 commit 用于撤销以前的 commit，则必须以revert:开头，后面跟着被撤销 Commit 的 Header。

revert: feat(pencil): add 'graphiteWidth' option

This reverts commit 667ecc1654a317a13331b17617d973392f415f02.

Body部分的格式是固定的，必须写成 This reverts commit &lt;hash>.，其中的hash是被撤销 commit 的 SHA 标识符。

如果当前 commit 与被撤销的 commit，在同一个发布（release）里面，那么它们都不会出现在 Change log 里面。如果两者在不同的发布，那么当前 commit，会出现在 Change log 的Reverts小标题下面。

git commit Examples

修改属于 Button 组件的新特性，新增了 primary 类型的按钮：

git commit -m "feat(Button): 新增 primary 类型按钮"

修改属于全局样式的调整，修改了文字颜色，对应的 issue 编号为 567：

git commit -m "style(Global): 修改文字颜色 close #567"

提交信息必须满足以下正则表达式：

/^(revert: )?(feat|fix|docs|style|refactor|perf|test|workflow|build|ci|chore|types|wip|dep)(\(.+\))?: .{1,50}/

Changelog

后续会从 commit 信息自动生成 changelog ，只有以下类型标签修改会被纳入到 changelog：

  • feat ：新特性
  • refactor ：重构
  • fix ：问题修复
  • style ：样式改动
  • types ：类型定义相关
  • dep ：新增依赖或依赖版本变动
  • docs ：文档相关
  • perf : 性能优化
  • test : 增加测试
  • chore : 构建过程或辅助工具的变动
  • revert : 回退版本
  • build : 打包
  • ci : 持续集成修改

注意

  • 如果一次修改涉及到多个类型，对比上述编号排序并选择编号最小的，或者选择最贴切的。
  • 在切分支开发时需要注意，目前 merge request 通常没有启用 squash commits ，所以对于暂时不确定是否会被采用的修改，请使用 chore wip 等不会被纳入 changelog 的标签。
  • 对于涉及到某个或多个 issue 的修改，请在提交信息中附带 close #1234 格式的标注。

vscode使用插件提交

  1. vscode 安装 git-commit-plugin 插件

  2. 使用命令快捷方式打开命令窗口或单击 git 插件导航栏上的图标showGitCommit

  3. 输入提交信息，该信息会自动生成符合规范的提交消息

http://www.ruanyifeng.com/blog/2016/01/commit_message_change_log.html

ant design pro git提交error； Angular 团队git提交规范的更多相关文章

  1. ant design pro （十三）advanced 错误处理

    一.概述 原文地址:https://pro.ant.design/docs/error-cn 二.详细 2.1.页面级报错 2.1.1.应用场景 路由直接引导到报错页面,比如你输入的网址没有匹配到任何 ...

  2. ant design pro （十二）advanced UI 测试

    一.概述 原文地址:https://pro.ant.design/docs/ui-test-cn UI 测试是项目研发流程中的重要一环,有效的测试用例可以梳理业务需求,保证研发的质量和进度,让工程师可 ...

  3. 阿里开源项目之Ant Design Pro

    本篇文章主要包含的内容有三个方面. 第一.Ant Design Pro简介; 第二.Ant Design Pro能做什么; 第三.初步使用; 我相信通过这三个方面的讲解能让你大概知道Ant Desig ...

  4. ant design pro（一）安装、目录结构、项目加载启动【原始、以及idea开发】

    一.概述 1.1.脚手架概念 编程领域中的“脚手架(Scaffolding)”指的是能够快速搭建项目“骨架”的一类工具.例如大多数的React项目都有src,public,webpack配置文件等等, ...

  5. Ant Design Pro快速入门

    在上一篇文章中,我们介绍了如何构建一个Ant Design Pro的环境. 同时讲解了如何启动服务并查看前端页面功能. 在本文中,我们将简单讲解如何在Ant Design Pro框架下实现自己的业务功 ...

  6. 【后台管理系统】—— Ant Design Pro入门学习&项目实践笔记（三）

    前言:前一篇记录了[后台管理系统]目前进展开发中遇到的一些应用点,这一篇会梳理一些自己学习Ant Design Pro源码的功能点.附:Ant Design Pro 在线预览地址. Dashboard ...

  7. 初探ant design pro

    1.增加路由子页面&配置菜单 因为ant design pro采取的是umi路由配置,所以只要在对应的文件夹下新建相关的文件夹以及文件,它会自动解析.按照如下的步骤做即可 PS.如果想要给菜单 ...

  8. 使用ant design pro搭建项目

    脚手架搭建 git clone --depth=1 https://github.com/ant-design/ant-design-pro.git my-project 然后 cd my-proje ...

  9. Nginx 部署 Ant Design pro

    利用Ant Design pro开发的项目,如何用Nginx部署呢? 第一步:把项目打包,打包命令如下: npm run build 运行完毕会在项目目录下生成dist文件夹. 第二步:想要测试打包好 ...

  10. ant design pro超详细入门教程

    1.Ant Design Pro 初了解 说到ant design pro,得先了解一下ant design是个什么东西?ant design蚂蚁金服基于react打造的一个服务于企业级产品的UI框架 ...

随机推荐

  1. MySQL语句判断数据库数据重复情况，新增、删除、不变。

    判断 7月8月两个月数据对比情况,新增.删除(离职).重复. 根据manager_name,gg_name,employer,department,historical_office判断出是否重复数据 ...

  2. Qt/C++音视频开发61-多屏渲染/一个解码渲染到多个窗口/画面实时同步

    一.前言 多屏渲染就是一个解码线程对应多个渲染界面,通过addrender这种方式添加多个绘制窗体,我们经常可以在展会或者卖电视机的地方可以看到很多电视播放的同一个画面,原理应该类似,一个地方负责打开 ...

  3. Qt开发经验小技巧166-170

    有时候需要暂时停止某个控件发射信号(比如下拉框combobox添加数据的时候会触发当前元素改变信号),有多种处理,推荐用 blockSignals 方法. //方法1:先 disconnect 掉信号 ...

  4. Qt音视频开发42-人脸识别客户端

    一.前言 人脸识别客户端程序,不需要和人脸识别相关的库在一起,而是通过协议通信来和人脸识别服务端通信交互,人脸识别客户端和服务端程序框架,主要是为了提供一套通用的框架,按照定好的协议,实现人脸识别的相 ...

  5. JMeter JDBC 请求实战宝典

    <JMeter JDBC 请求实战宝典> 宝子们,今天咱就来唠唠 JMeter 里超厉害的 JDBC 请求,这玩意儿就像是数据库世界的神奇魔杖,能帮咱把数据库里的各种秘密(数据)都挖出来, ...

  6. [Git][基本原理与命令]

    引言 Git是工作中最常用的版本控制工具,本文中将介绍其常用的命令. 根据作用的不同,可以分为基本命令.撤销命令.合并命令与远程仓库命令,下面将依次介绍这些命令. 基本原理 git 中提供了底层api ...

  7. flutter 的一些概念三

    本文同步发布于公众号:stringwu的互联网杂谈:flutter 的一些概念三 1 Stream 与 Future的关系 Stream 和 Future 都是 Flutter 中常用的异步编程模型, ...

  8. Linux curl brew命令详解

    命令:curl 在Linux中curl是一个利用URL规则在命令行下工作的文件传输工具,可以说是一款很强大的http命令行工具.它支持文件的上传和下载,是综合传输工具,但按传统,习惯称url为下载工具 ...

  9. JavaScript操作DOM元素的classList

    在JavaScript中,classList 是一个DOM元素属性,它提供了一组方法来添加.移除和切换元素的类名.classList 属性返回一个 DOMTokenList 集合,表示元素的类名. 这 ...

  10. idea+maven打包.jar发布项目

    开发完项目后,idea+maven环境打包成.jar包,才能发布项目.下面记录常用的几种打包方式. 一,通过mvn命令打包 比较专业的用法是通过mvn命令打包: mvn clean package - ...