当前位置: 首页 > news >正文

git Husky 搭配 commitizen ,规范代码提交

🍳作者: 贤蛋大眼萌,一名很普通但不想普通的程序媛 \color{#FF0000}{贤蛋 大眼萌 ,一名很普通但不想普通的程序媛} 贤蛋大眼萌,一名很普通但不想普通的程序媛🤳

🙊语录: 多一些不为什么的坚持 \color{#0000FF}{多一些不为什么的坚持} 多一些不为什么的坚持

在这里插入图片描述

git Husky 搭配 commitizen ,规范代码提交

    • 🪓 什么是 Husky
    • ⛏ 安装与配置
    • 💊 git commit 提交规范
    • 🎈 阻止不规范提交

🪓 什么是 Husky

  • husky 可以帮助我们在 执行 git commit 提交的时候,按照eslint 规范进行修复代码。
  • husky是一个git hook工具,可以帮助我们触发git提交的各个阶段:pre-commit、commit-msg、pre-push 支持所有的Git 钩子

简单说就是在 Git 执行一些操作时,在钩子处执行一些自己需要的命令。

⛏ 安装与配置

  1. 执行命令(自动配置):
npx husky-init && npm install

image-20221023094634513

image-20221023095359178

  1. 把自动生成的 npm run test 改成 npm run lint ,或者也可以是你自己自定义的命令。

image-20221023095807751

  1. 测试:

测试提交代码,看执行的命令行。

git commit 的时候,就出发 .husky / pre-commit 文件下我们自定义的命令

image-20221023100309700

💊 git commit 提交规范

image-20221023100400947

这个时候就需要我们使用 Commitizen 来帮助我们规范提交代码。

Commitizen是一个帮助我们编写规范 commit message 的工具。

  1. 安装commitizen
npm install commitizen -D
  1. 安装cz-conventional-changelog
npx commitizen init cz-conventional-changelog --save-dev --save-exact
  1. 配置完成

image-20221023102220792

  1. 测试(使用commitizen):
npx cz

第一步: 是选择type,本次更新的类型

image-20221023102925773

Type作用
feat新增特性 (feature)
fix修复 Bug(bug fix)
docs修改文档 (documentation)
style代码格式修改(white-space, formatting, missing semi colons, etc)
refactor代码重构(refactor)
perf改善性能(A code change that improves performance)
test测试(when adding missing tests)
build变更项目构建或外部依赖(例如 scopes: webpack、gulp、npm 等)
ci更改持续集成软件的配置文件和 package 中的 scripts 命令,例如 scopes: Travis, Circle 等
chore变更构建流程或辅助工具(比如更改测试环境)
revert代码回退

第二步:选择本次修改的范围(作用域)

image-20221023103131725

第三步: 选择提交的信息

image-20221023103237191

第四步:提交详细的描述信息

image-20221023103311224

第五步:是否是一次重大的更改

image-20221023103337914

第六步:是否影响某个open issue

image-20221023103400555

我们也可以在scripts中构建一个命令来执行 cz:
image-20210723150526211

🎈 阻止不规范提交

按照cz来规范了提交风格,但是依然有小伙伴通过 git commit 按照不规范的格式提交应该怎么办呢?

这个时候就可以通过commitlint来限制小伙伴的不规范提交了。

  1. 安装 @commitlint/config-conventional 和 @commitlint/cli
npm i @commitlint/config-conventional @commitlint/cli -D
  1. 在根目录创建commitlint.config.js文件,配置commitlint
module.exports = {
  extends: ['@commitlint/config-conventional']
}
  1. 使用husky生成commit-msg文件,验证提交信息:
npx husky add .husky/commit-msg "npx --no-install commitlint --edit $1"

image-20221023113238146

  1. 测试

image-20221023114324294

在日常开发中,特别是团队开发,养成严谨的代码提交规范十分重要,不仅利于自己,其他小伙伴的开发,也有利于后续代码的维护等等,一劳永逸,学起来。

在这里插入图片描述

相关文章:

  • 【数据结构与算法】排序算法总结
  • 拒绝宕机,华为云CDN赋能企业发展!
  • redis 的五大数据类型及其常用命令
  • 【从零开始游戏开发】EmmyLua插件注解功能
  • 最新CUDA/cuDNN与Pytorch保姆级图文安装教程(速查字典版)
  • 赶紧进来看看---万字博客详解C/C++中的动态内存管理
  • 【Python编程】九、Python文件操作
  • 今天面了个阿里拿27k出来的小哥,让我见识到了什么是天花板
  • 基于python/django的图书管理系统
  • “帆软杯”武汉大学2022级新生程序设计竞赛
  • C语言中的文件操作那些事儿~~
  • 百度地图API的使用(附案例)
  • 一小时快速入门MyBatis(知识结构清晰)
  • 深入理解计算机系统前篇总结
  • 剑指 Offer 12. 矩阵中的路径【回溯法】
  • JavaScript-如何实现克隆(clone)函数
  • [分享]iOS开发 - 实现UITableView Plain SectionView和table不停留一起滑动
  • [分享]iOS开发-关于在xcode中引用文件夹右边出现问号的解决办法
  • 【React系列】如何构建React应用程序
  • ES10 特性的完整指南
  • gcc介绍及安装
  • Hibernate【inverse和cascade属性】知识要点
  • Linux CTF 逆向入门
  • mockjs让前端开发独立于后端
  • October CMS - 快速入门 9 Images And Galleries
  • Python学习之路16-使用API
  • 大整数乘法-表格法
  • 汉诺塔算法
  • 技术:超级实用的电脑小技巧
  • 解析带emoji和链接的聊天系统消息
  • 理解在java “”i=i++;”所发生的事情
  • 浅谈web中前端模板引擎的使用
  • 如何打造100亿SDK累计覆盖量的大数据系统
  • 微服务框架lagom
  • 与 ConTeXt MkIV 官方文档的接驳
  • 《码出高效》学习笔记与书中错误记录
  • 【云吞铺子】性能抖动剖析(二)
  • ​3ds Max插件CG MAGIC图形板块为您提升线条效率!
  • ​软考-高级-系统架构设计师教程(清华第2版)【第1章-绪论-思维导图】​
  • $ is not function   和JQUERY 命名 冲突的解说 Jquer问题 (
  • $().each和$.each的区别
  • (2015)JS ES6 必知的十个 特性
  • (C语言)fgets与fputs函数详解
  • (C语言)球球大作战
  • (二)Eureka服务搭建,服务注册,服务发现
  • (附源码)springboot太原学院贫困生申请管理系统 毕业设计 101517
  • (每日持续更新)信息系统项目管理(第四版)(高级项目管理)考试重点整理第3章 信息系统治理(一)
  • (三)uboot源码分析
  • (一)硬件制作--从零开始自制linux掌上电脑(F1C200S) <嵌入式项目>
  • (转)拼包函数及网络封包的异常处理(含代码)
  • (轉貼) 蒼井そら挑戰筋肉擂台 (Misc)
  • .locked1、locked勒索病毒解密方法|勒索病毒解决|勒索病毒恢复|数据库修复
  • .NET Project Open Day(2011.11.13)
  • .Net 垃圾回收机制原理(二)
  • .Net 中Partitioner static与dynamic的性能对比