学不动系列-git-hooks和husky+lintstage

news2024/11/17 19:42:32

git-hooks

为了保证提交的代码符合规范,可以在上传代码时进行校验。常用husky来协助进行代码提交时的eslint校验。husky是基于git-hooks来实现,在使用husky之前,我们先来研究一下git-hooks。

构建git-hooks测试项目

需要使用git-hooks就需要git环境
新建文件夹02-githook,该项目使用eslint来做代码检查,项目构建参考eslint的测试项目,如下图所示:

npm init -y
npx eslint --init
npx eslint ./src

在这里插入图片描述
测试项目构建完毕。

测试git-hooks

配置git环境

回到根目录下,输入

git init

在根目录新建文件.gitignore

# Dependency directories
node_modules/

# Logs
logs
.pnpm-debug.log*
# Optional npm cache directory
.npm

# Optional eslint cache
.eslintcache

我们可以看到存在一个.git名称的文件夹,事实上,在我们项目中根目录下运行git命令时,git会根据它来工作,接下来我们进入到这个.git文件夹中
在这里插入图片描述
可以看到存在一个hooks文件夹,该文件夹提供过了git命令相关的钩子,也可以直接在vscode中查看,可能有些人的vscode中看不到.git文件夹,只需要在settings.json中配置一下即可

{
 "files.exclude":{
        "**/.git": false
    }
}

在这里插入图片描述
可以看到hooks文件夹中有很多xxxx.sample的文件,这些文件都是git的hooks,不同的名称有不同的作用如pre-commit.sample就是提交代码到git前触发,这些命令只要我们配置好就会帮助我们去执行,比如现在我们的需求是每次提交git代码之前检查一下代码是否有问题,运行eslint命令npx eslint .src/来检查代码,应该如何使用githooks?

使用githooks

  1. 重新创建一个文件,文件名为pre-commit去掉sample,其他的hooks也是如此的做法,pre-commit的内容如下:
#!/bin/sh
echo pre-commit

控制台输出文字 test pre-commit,代表成功的使用githooks,
2. 这里的echo test pre-commit脚本如果修改成eslint检测脚本不就可以完成需求了吗?例如修改成

#!/bin/sh
echo pre-commit && npx eslint ./src

在这里插入图片描述
修改app.js文件,输入命令

git add .

在这里插入图片描述
commit 成功后出现
在这里插入图片描述

这里又会出现一个问题,每个人开发的githooks配置都不同,没有办法做到每个人都统一,我们就需要将这个配置放在根目录下面,可以通过git同步这一部分的配置,达到同一个项目在提交代码前做代码检测,具体步骤如下:

  • 在根目录下新建文件夹.mygithooks
  • 将pre-commit放置到该文件夹下面,pre-commit的内容如下:
#!/bin/sh
echo .mygithooks pre-commit && npx eslint ./src
  • 配置git的core.hooksPath,指令如下:git config core.hooksPath .mygithooks
  • 再次提交代码,测试是否生效
    在这里插入图片描述

配置自定义的git-hooks

git config core.hooksPath .mygithooks
husky
Modern native Git hooks made easy

// 第一步:安装
npm i husky -D

// 第二步 enable git-hook
px husky install
husky - Git hooks installed

// 第三步:配置脚本
“scripts”: {
“prepare”: “husky install”
},

// 创建hook
npx husky add .husky/pre-commit “npm test”
git add .husky/pre-commit

husky

husky是基于git-hooks来实现

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/1479319.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

日志系统项目实现

日志系统的功能也就是将一条消息格式化后写入到指定位置,这个指定位置一般是文件,显示器,支持拓展到数据库和服务器,后面我们就知道如何实现拓展的了,支持不同的写入方式(同步异步),同步:业务线程自己写到文…

C语言基础(二)

5.指针 5.1 指针的定义 内存区域中的每字节都对应一个编号,这个编号就是“地址”. 在程序中定义一个变量,在对程序进行编译时,系统就会给这个变量分配内存单元. 按变量地址存取变量值的方式称为“直接访问”,如printf("&qu…

Nodejs+vue汽车保养美容管理系统vscode前后端分离项目

汽车美容保养管理系统后台采用nodejs语言开发,前台页面和后台管理页面使用vue等技术开发,使用MySql作为数据持久化存储工具对汽车美容保养管理系统的用户等角色权限对应的功能等进行存储。采用vsocde集成IDE对汽车美容保养管理系统统进行开发,整合系统的各个模块。 拟开发的汽车…

【数据分享】2000~2023年MOD15A2H 061 叶面积指数LAI数据集

各位同学们好,今天和大伙儿交流的是2000~2013年MOD15A2H 061 LAI数据集。如果大家有下载处理数据等方面的问题,您可以私信或评论。 Myneni, R., Y. Knyazikhin, T. Park. MODIS/Terra Leaf Area Index/FPAR 8-Day L4 Global 500m SIN Grid V061. 2021, d…

Python:关于数据服务中的Web API的设计

搭建类似joinquant、tushare类似的私有数据服务应用,有以下一些点需要注意: 需要说明的是,这里讨论的是web api前后端,当然还有其它方案,thrift,grpc等。因为要考虑到一鱼两吃,本文只探讨web ap…

USB - 设备架构及设备描述符

一、USB的设备架构 USB从上到下分为设备(device)、配置(config)、接口(interface)和端点(endpoint)四个层次。 Linux的USB设备驱动是绑定到接口上的, 每个接口在主机看来都是一个独…

基于springboot+vue的共享汽车管理系统(前后端分离)

博主主页:猫头鹰源码 博主简介:Java领域优质创作者、CSDN博客专家、阿里云专家博主、公司架构师、全网粉丝5万、专注Java技术领域和毕业设计项目实战,欢迎高校老师\讲师\同行交流合作 ​主要内容:毕业设计(Javaweb项目|小程序|Pyt…

互动多媒体内容的魔法:如何让你的网页活起来

互动多媒体内容的魔法:如何让你的网页活起来 前言 在之前的文章中,我们探讨了网页结构中的基础介绍,本文将介绍如何通过简单的交互增强用户体验,包括图像大小的动态切换,以及音视频内容的播放控制来介绍网页多媒体的具…

Swiper实现轮播效果

swiper官网&#xff1a;https://3.swiper.com.cn/ <!DOCTYPE html> <html lang"en"><head><meta charset"UTF-8" /><meta name"viewport" content"widthdevice-width, initial-scale1.0" /><title&…

Redis 之三:发布订阅(pub/sub)

概念介绍 Redis 发布订阅 (pub/sub) 是一种消息通信模式&#xff0c;它允许客户端之间进行异步的消息传递 Redis 客户端可以订阅任意数量的频道。 模型中的角色 在该模型中&#xff0c;有三种角色&#xff1a; 发布者&#xff08;Publisher&#xff09;&#xff1a;负责发送信…

【DIY】TA7376组成的耳机放大电路

用头戴式耳机&#xff0c;尤其是小型耳机听音乐&#xff0c;总感到音乐味不够足&#xff0c;在低频段的效果更差。因此用本机增强耳机的低频特性&#xff0c;并采用立体声反相合成的办法&#xff0c;加上内藏简易矩阵环绕声电路&#xff0c;能获得强劲的低音和在较宽的范围内展…

使用Node.js构建一个简单的聊天机器人

当谈到人工智能&#xff0c;我们往往会想到什么&#xff1f;是智能语音助手、自动回复机器人等。在前端开发领域中&#xff0c;我们也可以利用Node.js来构建一个简单而有趣的聊天机器人。本文将带你一步步实现一个基于Node.js的聊天机器人&#xff0c;并了解其工作原理。 首先…

http模块学习

http模块 客户端&#xff1a;负责消费资源的电脑 服务器&#xff1a;负责对外提供网络资源的电脑&#xff0c;与普通电脑的区别就在于服务器上 安装了web服务器软件。 http模块是Node.js官方提供用来 创建web服务器的模块&#xff0c;通过http模块提供的http.createServer()方…

WPS/Office 好用的Word插件-查找替换

例如&#xff1a;一片文档&#xff1a;…………泰山…………泰&#xff08;少打了山字&#xff09;………… 要是把“泰”查找替换为“泰山”&#xff0c;就会把前面的“泰山”变成“泰山山”&#xff0c;这种问题除了再把“泰山山”查找替换为“泰山”&#xff0c;有没有更简单…

1978-2022年各省农业总产值数据(无缺失)

1978-2022年各省农业总产值数据(无缺失) 1、时间&#xff1a;1978-2022年 2、范围&#xff1a;包括全国31省 3、来源&#xff1a;国家统计J、统计NJ、各省NJ 4、指标解释&#xff1a;农业总产值是一定时期&#xff08;通常为一年&#xff09;内以货币形式表现的农、林、牧、…

RK3568平台开发系列讲解(基础篇)文件私有数据

🚀返回专栏总目录 文章目录 一、文件私有数据二、文件私有数据实验沉淀、分享、成长,让自己和他人都能有所收获!😄 一、文件私有数据 Linux 中并没有明确规定要使用文件私有数据,但是在 linux 驱动源码中,广泛使用了文件私有数据,这是 Linux 驱动遵循的“潜规则”,实…

【三、接口协议与抓包】使用TcpDump + WireShark抓包分析三次握手与四次挥手

你好啊&#xff01;我是山茶&#xff0c;一个持续探索 AI 测试之路的程序员。 对于三次握手与四次挥手的理解与基本讲解如下。 那么具体的请求是什么样的呢&#xff1f;使用 TCPDump WireShark 对 TCP 三次握手与四次挥手展示 协议分析工具 网络监听&#xff1a;TcpDump Wi…

Centos中安装Docker及Docker的使用

在centos7系统中安装指定版本的docker,并通过docker使用安装mysql为例,阐述docker的使用。 2.1、Docker卸载及安装yum依赖 【卸载Docker,如果安装的Docker的版本不合适】 yum remove docker \docker-client \docker-client-latest \docker-common \docker-latest \docker-…

探索口袋中的远程控制神器

在这个科技日新月异的时代&#xff0c;我们的生活被各种手机软件所包围。几乎每个人都有一个甚至多个手机&#xff0c;你是否也有遇到过需要远程操作自己某一台手机的场景呢&#xff1f;今天&#xff0c;我要向大家推荐一款神奇的手机远程操作神器&#xff0c;让你可以随时随地…

旧版android模拟器,37岁程序员被裁

前言 从18年毕业至今&#xff0c;就职过两家公司&#xff0c;大大小小项目做了几个&#xff0c;非常感谢我的两位老大&#xff0c;在我的android成长路上给予我很多指导&#xff0c;亦师亦友的关系。 从年前至今参加面试了很多公司&#xff0c;也收到了几家巨头的offer&#…