Loading [MathJax]/jax/output/CommonHTML/config.js
前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
MCP广场
社区首页 >专栏 >前端代码风格自动化系列(一)之Husky

前端代码风格自动化系列(一)之Husky

作者头像
河马嘴不大
发布于 2022-12-24 04:21:18
发布于 2022-12-24 04:21:18
84900
代码可运行
举报
运行总次数:0
代码可运行

代码风格和性格一样,每个程序员都有自己的特点,但对于大家协同开发的项目,还是需要力求代码风格的一致性,以减少Bug,方便互相修改,短时间内能上手,在这条路上诞生了许许多多的工具。本系列主要介绍目前主流的前端代码格式化的工具。

本篇主要介绍代码提交钩子Husky的用法,在代码被提交到Git仓库之前,我们可以在这里做一些预检查或者格式化,需要做这些操作,我们需要一个Git的提交钩子,简单说就是使用Git命令会触发的函数。

安装

代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
npm install husky --save-dev

配置

代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
// package.json
{
  "husky": {
    "hooks": {
      "pre-commit": "npm run test",
      "pre-push": "npm  run test",
      "...": "..."
    }
  }
}

1.0.0之后的版本支持了使用.huskyrc.huskyrc.json.huskyrc.js配置文件,可以不放在package.json中。

Husky支持的Git hooks还是很全面的,如常用的pre-commitpre-push。这样我们就能再一些特定的时间点做一些事情。

本文参与 腾讯云自媒体同步曝光计划,分享自作者个人站点/博客。
原始发表:2019-01-07,如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 作者个人站点/博客 前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体同步曝光计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
暂无评论
推荐阅读
编辑精选文章
换一批
前端规范指南,让团队代码如出一辙!ESLint + Prettier + husky + lint-staged
假如团队中的小伙伴在提交代码时没有遵循规范要求,例如只写了一个"修改"或"更新,这会给团队中其他小伙伴造成困扰呢,不得不花时间查看代码和推测逻辑。
程序员王天
2023/10/18
3K0
前端规范指南,让团队代码如出一辙!ESLint + Prettier + husky + lint-staged
前端代码风格自动化系列(四)之Prettier
Prettier是一个支持多语言的代码格式工具,如常用的:js、jsx、Vue、Flow、Ts、HTML、CSS等,非常全面,将代码解析为AST,然后重新组装,目的是最终输出风格统一的代码,对比eslint对error的fix要强一些,如最大长度的改动,eslint只是对有问题的地方进行格式化修改,不改动源代码风格,而prettier是对全量的代码进行格式化。
河马嘴不大
2022/12/24
4220
如何规范开发一个vue项目
在软件开发的浩渺星海中,编程规范如同航海的罗盘,为我们指引方向,确保我们的代码之旅能够顺利、高效地到达目的地。无论是个人开发者还是大型团队,编程规范都是提升代码质量、保障项目成功不可或缺的一环。
炑焽
2024/09/07
3410
husky+lint-staged助力团队编码规范
Git Hooks 就是在 Git 执行特定事件(如commit、push、receive等)时触发运行的脚本,类似于“钩子函数”,没有设置可执行的钩子将被忽略。
零式的天空
2022/03/28
2.8K0
前端代码风格自动化系列(三)之Lint-staged
在我们介绍了Husky、Commitlint之后,来看一个前端文件过滤的工具Lint-staged,代码的格式化肯定会涉及到文件系统,一般工具会首先读取文件,格式化操作之后,重新写入。对于较大型的项目,文件众多,首先遇到的就是性能问题,虽然如Eslint之类的也有文件过滤配置,但毕竟还是对于匹配文件的全量遍历,如全量的.js文件,基本达不到性能要求,有时还会误格式化其他同学的代码,因此我们引入Lint-staged,一个仅仅过滤出Git代码暂存区文件(被committed的文件)的工具。
河马嘴不大
2022/12/24
1.7K0
测试开发必学技能之一:代码提交规范与自动生成工具!
约定式提交(Conventional Commits)是一种用于代码版本控制的规范,旨在通过明确和标准化提交信息来提高代码协作质量和效率。其基本原则是通过规定提交信息的结构和语义来提高代码版本控制的可读性、可维护性和自动化程度。
测试开发技术
2024/12/23
1570
测试开发必学技能之一:代码提交规范与自动生成工具!
项目中使用 husky 格式化代码和校验 commit 信息
大家好,我是前端西瓜哥。今天我们学习使用 husky 工具,在 commit 的时候做一些风格的校验工作,包括 commit 信息格式化和文件格式化。
前端西瓜哥
2022/12/21
2.4K0
项目中使用 husky 格式化代码和校验 commit 信息
关于 git hooks 的库 husky 源码竟如此简单,你也可以写一个!
它在 git commit、git push 等 git 操作之前与之后可设置自动执行的脚本,被称为 git hooks 脚本。
山月
2021/11/10
1.2K0
使用 husky 和 lint-staged 来构建你的前端工作流
ESLint 是一个在前端工具链中被众人熟知的代码检查工具,它能够被开发者灵活的配置,使其能够达到我们提前制定好的代码规范的要求,并且在编码过程中实时检测输入的代码,对于不符合代码规范的代码警告或报错。不得不说,在有了 ESLint 这个工具之后,团队之间开发维护会舒服很多,因为在强制约束下,你只需要去理解代码本身的含义就可以了,对于风格的问题则少了很多麻烦。
Originalee
2019/06/24
3.1K0
2022年3月最新Eslint + Prettier + Husky + Stylelint + Jest + CI/CD 超详细前端单元测试&规范工程化工作流
由于我的示例项目使用Next.js框架构建,需要在extends中额外配置"next"。 同时个人建议配置react-hooks插件
源心锁
2022/08/12
2K0
2022年3月最新Eslint + Prettier + Husky + Stylelint + Jest + CI/CD 超详细前端单元测试&规范工程化工作流
巧用 gitHooks 提交前校验代码
在每一个使用 git 进行版本管理的仓库,都有一个目录 .git/hooks,包含 commit 各个阶段 Hooks 的脚本。这些 Hooks 在 git 操作 commit、push、merge 等得时候,可以做前置或者后置的操作,例如 pre-commit 在 git commit 前可以做代码校验,校验代码的时候使用的ESLint,格式化使用的是 prettier。Git 支持的常用钩子见下表,更多请查看官网Hooks:
刘小夕
2021/12/09
4.9K0
巧用 gitHooks 提交前校验代码
用 husky 和 lint-staged 构建代码检查工作流
一个项目如果涉及到多人协作,由于每个人代码的书写习惯和风格不太一样,如果没有统一的规范,那就会很乱,这对代码的可维护性大大降低。
桃翁
2022/03/30
5.7K0
用 husky 和 lint-staged 构建代码检查工作流
Prettier与ESLint:代码风格与质量的自动化保证
Prettier 和 ESLint 是两个互补的工具,它们共同确保代码的风格一致性和质量。Prettier 负责格式化代码,而 ESLint 则执行更复杂的静态分析和规则检查。
天涯学馆
2024/06/15
4870
【Vue工程】003-配置 husky、lint-staged、@commitlint/cli
Husky 是一个 Git Hook 工具,可以帮助我们在 Git 事件发生时自动运行脚本。Git Hook 是一种机制,它允许在 Git 执行操作时自动运行特定脚本,以执行自定义操作。
訾博ZiBo
2025/01/06
2070
在2018年如何优雅的开发一个typescript语言的npm包?
很多时候,我们可能想要用 typescript 语言来创建一些模块,并提交到 npm 供别人使用,
小明plus
2018/11/08
4.2K1
在2018年如何优雅的开发一个typescript语言的npm包?
15分钟快速配置eslint,prettier,lint-staged,husky,commitizen实现前端项目代码规范化
当前,前端项目支持代码规范校验、代码格式化已经必不可少,同时需要支持代码提交前对代码格式校验预检查,这里提供一份最简单的配置供大家参考。
蓓蕾心晴
2022/05/09
4.8K2
15分钟快速配置eslint,prettier,lint-staged,husky,commitizen实现前端项目代码规范化
为什么 husky 放弃了传统的 JS 配置
husky想必大家都不陌生。作为前端工程化中一个不可或缺的的工具,它可以向我们的项目中添加git hooks。同时配合lint-staged可以方便的在代码提交前进行lint。
前端森林
2021/09/10
2.3K0
为什么 husky 放弃了传统的 JS 配置
利用 Git Hook 自动化 Go 代码审查,提高代码质量
在日常开发中,代码质量的保证一直是团队关注的重点,尤其是随着项目规模的扩大,代码审查变得尤为重要。传统的代码审查虽然能帮助发现问题,但往往需要手动执行多次检查,并且容易受到疏漏的影响。
陈明勇
2025/01/24
2906
项目git commit时卡主不良代码:husky让Git检查代码规范化工作
看完 《前端规范之Git工作流规范(Husky + Commitlint + Lint-staged) https://www.cnblogs.com/Yellow-ice/p/15349873.html》,再次修改本文
周陆军博客
2022/07/12
2K0
git hook实践心得
优秀的团队必不可缺少源代码的质量管理,比如eslint、sasslint等代码检测工具,借助git hook能力,我们可以将这些工具无缝地整合到git开发工作流中。
IMWeb前端团队
2019/12/03
1.3K0
git hook实践心得
推荐阅读
相关推荐
前端规范指南,让团队代码如出一辙!ESLint + Prettier + husky + lint-staged
更多 >
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档
本文部分代码块支持一键运行,欢迎体验
本文部分代码块支持一键运行,欢迎体验