前端使用工具规范commit信息
前言
通过工具规范git提交信息也是工程化的一部分,在前端领域有一些工具为我们提供了相关功能,在这里做一下使用总结。
commitlint
commitlint是什么?
就像eslint用来检查js代码是否标准,commitlint用来检查提交信息是否满足固定格式的工具。
同样,commitlint提供了一些规则供我们配置。commitlint怎么用?
和eslint一样,commitlint提供了相应的api供我们调用、或者和其他工具集成
安装:npm install -g @commitlint/cli @commitlint/config-conventional其中@commitlint/config-conventional是常用的插件。 commitlint常用命令:- commitlint -e 命令就可以检查.git/COMMIT_EDITMSG里面的commit message是否符合格式;
- commitlint -e ./aaa 命令就可以检查文件./aaa里面内容是否符合格式;
- commitlint -E HUSKY_GIT_PARAMS 读取环境变量HUSKY_GIT_PARAMS对应的文件的内容,默是.git/COMMIT_EDITMSG
配置文件 commitlint.config.js/.commitlintrc.js
类似于.eslintrc.js文件,用来配置commitlint规则。extends字段类似于eslint的extends
module.exports = {
extends: ['@commitlint/config-conventional'],
rules: {
'header-max-length': [2, 'always', 60],
},
};
commitizen
commitizen是什么?
正常git commit 我们可以写出符合commitlint的提交信息,但是如果有命令行提示我们一步步的写就更方便了,于是出现了commitizen就是一个这样的工具。
commitizen怎么用?
- npm install commitizen 之后使用 git cz 来替代 git commit 提交信息。
- npm install cz-customizable
cz-customizable 是可自定义的Commitizen插件,
commitizen中有个
Commitizen friendly的概念,如果是Commitizen-friendly,执行git cz会进入交互式操作;如果不是Commitizen-friendly就会和普通git commit一样。一般项目在没有安装相关插件的情况下不是Commitizen-friendly, 要做到Commitizen-friendly需要adapter,比如:cz-customizable 或者cz-conventional-changelog 。cz-customizable 用的更多一些。配置cz-customizable
指定commitizen用哪个adapter:
// package.json
"config": {
"commitizen": {
"path": "node_modules/cz-customizable"
},
"cz-customizable": {
"config": "config/path/to/my/config.js"
}
}
创建.cz-config.js自定义提交规则。
- types: 描述修改的性质是什么,是bugfix还是feat,在这里进行定义。
- scopes: 定义之后,我们就可以通过上下键去选择 scope
- scopeOverrides: 针对每一个type去定义scope
- allowBreakingChanges: 设置为 ['feat', 'fix'],只有我们type选择了 feat 或者是 fix,才会询问我们 breaking message.
- allowCustomScopes: 设置为 true,在 scope 选择的时候,会有 empty 和 custom 可以选择,顾名思义,选择 empty 表示 scope 缺省,如果选择 custom,则可以自己输入信息
- skipQuestions: 指定跳过哪些步骤,例如跳过我们刚刚说的详细描述,设置其为 scope: ['body'],假设我们的项目也不会涉及到关联 issue,我们可以设置其为 scope: ['body', 'footer']
- subjectLimit: 描述的长度限制
cz-customizable 会首先在项目根目录下寻找: .cz-config.js 或 .config/cz-config.js,如果找不到,会去主目录寻找。我们也可以在 package.json 中手动去指定配置文件的路径
总结
可以使用commitlint做提交信息的校验, 也可以使用commitizen简化提交的负担,还可以使用husky将这些约束放到提交钩子里,这些都是在本地做的校验,开发者其实是可以跳过这些校验和约束的,那么如果要做更严格的约束就需要在远程git服务器上增加校验处理。
前端使用工具规范commit信息的更多相关文章
- Web前端开发标准规范
web前端开发规范的意义 提高团队的协作能力 提高代码的复用利用率 可以写出质量更高,效率更好的代码 为后期维护提供更好的支持 一.命名规则 命名使用英文语义化,禁止使用特殊字符,禁止使用拼音,禁止使 ...
- Web 前端开发代码规范(基础)
一. 引言 对于一个多人团队来说,制定一个统一的规范是必要的,因为个性化的东西无法产生良好的聚合效果,规范化可以提高编码工作效率,使代码保持统一的风格,以便于代码整合和后期维护. 二. HTML/CS ...
- 前端构建工具gulpjs的使用介绍及技巧
gulpjs是一个前端构建工具,与gruntjs相比,gulpjs无需写一大堆繁杂的配置参数,API也非常简单,学习起来很容易,而且gulpjs使用的是nodejs中stream来读取和操作数据,其速 ...
- 前端构建工具gulp使用
前端自动化流程工具,用来合并文件,压缩等. Gulp官网 http://gulpjs.com/ Gulp中文网 http://www.gulpjs.com.cn/ Gulp中文文档 https://g ...
- 前端模块化工具-webpack
详解前端模块化工具-webpack webpack是一个module bundler,抛开博大精深的汉字问题,我们暂且管他叫'模块管理工具'.随着js能做的事情越来越多,浏览器.服务器,js似乎无处不 ...
- 前端构建工具gulp介绍
2016年3月3日 10:46:08 晴 前端构建工具gulpjs的使用介绍及技巧 gulpjs是一个前端构建工具,与gruntjs相比,gulpjs无需写一大堆繁杂的配置参数,API也非常简 ...
- 前端见微知著工具篇:Grunt实现自动化
转载说明 本篇文章为转载文章,来源为[前端福利]用grunt搭建自动化的web前端开发环境-完整教程,之所以转载,是因为本文写的太详细了,我很想自己来写,但是发现跳不出这篇文章的圈子,因为写的详尽,所 ...
- 前端自动化工具 -- grunt 使用简介
grunt作为一个前端构建工具,有资源压缩,代码检查,文件合并等功能. 下面就简单了解grunt的使用. 一.环境配置 grunt是基于nodejs的,所以需要一个 nodejs 环境,未了解的可以 ...
- Node.js前端自动化工具:gulp
前端自动化工具 -- gulp 使用简介 gulp是基于流的前端自动化构建工具. 之前也谈到了 grunt的用法,grunt其实就是配置+配置的形式. 而gulp呢,是基于stream流的形式,也就是 ...
- 前端构建工具gulpjs
gulpjs是一个前端构建工具,与gruntjs相比,gulpjs无需写一大堆繁杂的配置参数,API也非常简单,学习起来很容易,而且gulpjs使用的是nodejs中stream来读取和操作数据,其速 ...
随机推荐
- C#并发编程-3 并行编程基础
如果程序中有大量的计算任务,并且这些任务能分割成几个互相独立的任务块,那就应该使用并行编程. 并行编程用于分解计算密集型的任务片段,并将它们分配给多个线程.这些并行处理方法只适用于计算密集型的任务. ...
- 洛谷P1640 SCOI2010 连续攻击游戏 (并查集/匹配)
本题介绍两种做法: 1 并查集 1 #include<bits/stdc++.h> 2 using namespace std; 3 const int N=1000005; 4 int ...
- uni-app 如何优雅的使用权限认证并对本地文件上下起手
这里给大家分享我在网上总结出来的一些知识,希望对大家有所帮助 1.起因 最近有一个需求,需要使用自定义插件,来对接硬件功能,需要配合对手机的权限进行判断和提示,并在对接后对本地文件进行操作,这里给大家 ...
- 构造器与this、package、import关键字的使用
构造器一.构造器的作用: 1.创建对象 2.初始化对象的信息 二.说明: 1.如果没有显式的定义类的构造器的话,则系统默认提供一个空参的构造器 2.定义构造器的格式:权限修饰符 类名(形参列表){} ...
- 5.-GET请求和POST请求
一.定义 无论是GET请求还是POST,统一由视图函数接收请求,通过判定request.method区分具体的请求动作 二.GET处理 GET请求方式中,如果有数据需要传递给服务器,通常会用查 ...
- 编辑距离(Minimum Edit Distance)
编辑距离(Minimum Edit Distance,MED),也叫 Levenshtein Distance.他的含义是计算字符串a转换为字符串b的最少单字符编辑次数.编辑操作有:插入.删除.替换( ...
- JAVA语言学习-面向对象(1)
类与对象 类 类是JAVA语言中重要的复合型数据类型().类的实现包括两个部分:成员变量和成员方法("方法"可以看作是C语言中的函数) 类的声明 要使用类,首先得对其声明.声明一个 ...
- ValidList
package com.dlzb.enterprising.config; import javax.validation.Valid; import java.util.*; public clas ...
- 嵌入式-c语言基础:冒泡排序实现从大到小排列
#include<stdio.h> int main() { /*冒泡排序:从大到小*/ /*i=0 第1轮(i+1):需要比较9次(sizeArr-i-1)*/ /*i=1 第2轮(i+ ...
- C#自定义控件(3)—PanelHead控件
有时候我们会需要这样一种控件效果,上面是标题,下面是另外一个区域,且分别需要设置不同的颜 色等,当然我们可以使用splitContainer控件来制作,也可以直接使用自定义控件来,这样可以减少一 定的 ...