在开发过程中,通常使用 eslint 来规范团队的代码风格。但是 eslint 只能在开发服务器启动的时候才去检验代码。如果一个人在不启动开发服务器的情况下,修改了代码直接提交到git,那么别人pull下来的代码肯定会报错,我们需要把错误遏制在提交之前。

唯一的麻烦可能是地震的时候commit不太方便

------- 一位成都前端开发者留言说

git hooks 是什么

git hooks 是git的一种钩子机制,可以让用户在git操作的各个阶段执行自定义的逻辑。

git hooks 在项目根目录的 .git/hooks 下面配置,配置文件的名称是固定的,使用shell语法编写。

里面包含 pre-commit , pre-push , commit-msg等多种钩子,具体可以查看 Git 钩子

从头编写如此多的 shell脚本 太难,所以我们使用 husky 来帮我们自动生成这些 shell脚本

husky是什么

husky 就是一款用于处理 git hooks 的npm包包。

安装好 husky,他会自动在项目的 .git/hooks 文件夹下面生成各种配置文件。

如果你在git init之前已经安装了 husky,那么需要卸载掉再重装才能使用。

pre-commit 举例

不推荐使用 husky 来管理 pre-commit,因为他只是简单的运行 npm run lint命令来检测当前的文件状态,而无法检测仅仅暂存区的文件。推荐使用以下配置通过检测暂存区文件,来阻止不规范代码的提交。

这是 .git/hooks/pre-commit 文件的源码:

#!/bin/bash

# 如果在commit时有未添加到暂存区的文件,拒绝提交
diff=$(git diff)
if [[ $diff !=0 ]];then
echo "some files is changed but not add to stash, git commit denied"
exit 1
fi # 读取git暂存区的.js 和 .vue文件
files=$(git diff --cached --name-only | grep -E '\.js$|\.vue$') # 在控制台打印文件列表
echo $files
# Prevent ESLint help message if no files matched # 如果文件列表为空,退出执行环境,继续执行commit操作
if [[ $files = "" ]] ; then
exit 0
fi failed=0 # 循环文件列表
for file in ${files}; do
# 判断文件是否存在(-e 表示 exists)
if [ ! -e $file ] ; then
continue
fi # 在控制台打印该文件的eslint检验结果,如果通过,则返回空
git show :$file | ./node_modules/.bin/eslint $file --color --fix # 文件未通过eslint检验,标记为失败
if [[ $? != 0 ]] ; then
failed=1
fi
done; # 有文件未通过检验,退出执行环境,中断commit操作
if [[ $failed != 0 ]] ; then
echo "❌ ESLint failed, git commit denied"
exit $failed
fi

从文件源码可以看出,git 将会在你将文件添加到暂存区后,执行eslint操作,通不过操作的时候,这次操作将被取消 (shell exit 1)。

注意,需要使用npm而不是yarn安装node_modules

通过测试发现,如果通过 yarn add 的方式安装 eslint , babel-eslint 的话,这句代码将会报错:

git show :$file | ./node_modules/.bin/eslint $file --color --fix

只用用npm重新安装上面提到的一些包,才能在 ./node_modules/.bin 目录下找到eslint,不知道你们有没有遇到这样的问题。

注意,需要使用unix文件编码

git hooks 需要的 shell脚本,需要是unix文件格式才能正常运行。

否则windows10系统会抛出换行符错误,而macOS则会抛出 pre-commit 不是文件或者文件夹的错误。

需要打开bash,使用如下命令修改,方可正常使用。

vi ./.git/hooks/pre-commit     # 打开配置文件
:set ff-unix # 设置文件格式为unix文件,(ff意为fileformat)
:wq # 保存修改并退出

[git hooks] pre-commit 配置的更多相关文章

  1. git commit -m "XX"报错 pre -commit hook failed (add --no-verify to bypass)问题

    在同步本地文件到线上仓库的时候 报错 pre -commit hook failed (add --no-verify to bypass) 当你在终端输入git commit -m "xx ...

  2. 8.3 Customizing Git - Git Hooks 钩子 自动拉取 自动部署 提交工作流钩子,电子邮件工作流钩子和其他钩子

    https://git-scm.com/book/en/v2/Customizing-Git-Git-Hooks https://github.com/git/git/blob/master/temp ...

  3. CentOS6.4下Git服务器Gitosis安装配置

    1.安装GIt: #yum install git 2.增加一个git用户 #useradd git #passwd git 3.创建git仓库存储目录,设置权限 #mkdir /home/git/r ...

  4. Git Hooks、GitLab CI持续集成以及使用Jenkins实现自动化任务

    Git Hooks.GitLab CI持续集成以及使用Jenkins实现自动化任务 前言 在一个共享项目(或者说多人协同开发的项目)的开发过程中,为有效确保团队成员编码风格的统一,确保部署方式的统一, ...

  5. 使用Git Hooks实现开发部署任务自动化

    前言 版本控制,这是现代软件开发的核心需求之一.有了它,软件项目可以安全的跟踪代码变更并执行回溯.完整性检查.协同开发等多种操作.在各种版本控制软件中,git是近年来最流行的软件之一,它的去中心化架构 ...

  6. 012-基于 git hooks 的前端代码质量控制解决方案

    原文看这里:https://github.com/kuitos/kui...全部文章看这里 https://github.com/kuitos/kui... 国际惯例先说下故事背景 通常情况下,如果我 ...

  7. 通过Gradle Plugin实现Git Hooks检测机制

    背景 项目组多人协作进行项目开发时,经常遇到如下情况:如Git Commit信息混乱,又如提交者信息用了自己非公司的私人邮箱等等.因此,有必要在Git操作过程中的适当时间点上,进行必要的如统一规范.安 ...

  8. 8.3 Customizing Git - Git Hooks

    https://git-scm.com/book/en/v2/Customizing-Git-Git-Hooks https://github.com/git/git/blob/master/temp ...

  9. vite vue3 规范化与Git Hooks

    在 <JS 模块化>系列开篇中,曾提到前端技术的发展不断融入很多后端思想,形成前端的"四个现代化":工程化.模块化.规范化.流程化.在该系列文章中已详细介绍了模块化的发 ...

随机推荐

  1. 几种模型文件(CDM、LDM、PDM、OOM、BPM)

    概念数据模型 (CDM): 帮助你分析信息系统的概念结构,识别主要实体.实体的属性及实体之间的联系.概念数据模型(CDM)比逻辑数据模型 (LDM)和物理数据模型(PDM)抽象.CDM 表现数据库的全 ...

  2. GridBagLayout布局管理器应用详解

    http://www.cnblogs.com/kungfupanda/p/7220217.html GridBagLayout布局管理器应用详解 很多情况下,我们已经不需要通过编写代码来实现一个应用程 ...

  3. iOS 固定定位不兼容、input获取焦点后位置不对。

    第一次写博客~  大家悠着看,有则改之,无则加冕,对不对的给个回复,让我知道你的存在. 在做活动页的时候,经常会碰到一些需要弹出显示的输入框(情节前提:本人安卓机~),前天自己写的时候自己调试没问题后 ...

  4. Bank项目

    项目概述: 技术涵盖:由 8 组由浅入深的模块构成,应用如下技术:面向对象的封装性.构造器.引用类型的成员变量.异构数组.继承.多态.方法的重载.方法的重写.包装类.单子模式.异常.集合. 实现功能: ...

  5. [转]VS2013+简单稀疏光束调整库SSBA配置(64位编译)

    有关SSBA库的资源比较少,我是在Github上搜索下载的,具体的GitHub官方下载地址为:SSBA 下载后在SSBA解压文件夹下新建文件夹build. 打开cmake gui,在source co ...

  6. setattr

    setatt r给对象的属性赋值,若属性不存在,先创建再赋值 用法 setattr(object, name, values) object -- 对象. name -- 字符串,对象属性. valu ...

  7. java操作数据库的事务支持

    一.需求背景: 我们生活经常遇到一个情况:在购买商品的时候,已经支付的了,那么商品应该处于已购买订单里.而不是付款之后,已购买商品没有. 还有转账的时候,转出方和转入方都需要扣减相应的金额,而不是一方 ...

  8. Java使用PropertyDescriptor获取实体类中私有属性的值,并给私有属性赋值

    大家都知道Java类中的私有的(private)属性是获取不到的(即使使用继承依然获取不到),那如果非要获取私有属性的值怎么办呢?一般的做法是将该java类封装称为一个JavaBean,即封装该私有属 ...

  9. log下一次坑爹的疏忽

    今天调试一段十几行的代码,也让我是一顿咒骂...就说说是怎么回事哈哈. 是这样的,这个页面foreach了一个个的div块,每个div里有个a标签,这个按钮绑定了个点击事件.事件走了个ajax,根据返 ...

  10. Docker中查看Mysql数据库中的各环境参数

    通过官方的文档可以看到运行MySQL容器的命令是: docker run --name some-mysql -e MYSQL_ROOT_PASSWORD=mypwd -d mysql:tag 如:d ...