Vue3基于husky的代码检查工作流
更新时间：2023年11月28日 14:29:52 作者：小沐°
husky是一个git hooks工具（git的钩子工具，可以在特定时机执行特定的命令），这篇文章主要介绍了Vue3-基于husky的代码检查工作流,需要的朋友可以参考下
husky是一个git hooks工具（git的钩子工具，可以在特定时机执行特定的命令）
代码检查
背景：想要使代码上传到git仓库前进行代码检查，所以提前下载好git
打开项目终端，点击右上角选择进入Git Bash控制
1.如果当前项目没有被git进行管理，就需要先初始化git仓库，执行git init即可；如果不初始化直接进行husky处理肯定是不行的
git init
2.初始化husky工具配置
官网：https://typicode.github.io/husky/
pnpm dlx husky-init&&pnpm install
配置成功后，会出现.husky文件，可以点进pre-commit文件查看
3.修改.husky/pre-commit文件
将npm test修改为pnpm lint，只要一提交代码就会触发这个pnpm lint（代码校验）
如果项目中有代码不符合规范，在提交到仓库时就会有报错提示
问题：pnpm lint是全量检查，耗时问题（文件量大时），历史问题（前期代码并没有使用规范）
暂存区eslint校验（解决上面问题，企业级项目更常用）
只用对自己写的代码负责
1.安装lint-staged包
pnpm i lint-staged -D
2.package.json配置lint-staged命令
在图中红色区域里添加如下代码：
"lint-staged": {
"*.{js,ts,vue}": [
"eslint --fix"
]
}"lint-staged": "lint-staged"
3..husky/pre-commit文件修改
将pnpm lint修改为pnpm lint-staged
到此这篇关于Vue3-基于husky的代码检查工作流的文章就介绍到这了,更多相关Vue3代码检查工作流内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家！
相关文章
v-for是vue的循环指令,作用是遍历数组(对象)的每一个值,这篇文章主要给大家介绍了关于Vue中v-for的9种使用案例的相关资料,文中通过代码介绍的非常详细,需要的朋友可以参考下2023-12-12
这篇文章主要介绍了详解Nuxt.js部署及踩过的坑，Nuxt.js 提供了两种发布部署应用的方式：服务端渲染应用部署 和 静态应用部署。本文主要说说服务端渲染应用部署，感兴趣的小伙伴们可以参考一下2018-08-08
关于ElementUI el-table 鼠标滚动失灵的问题及解决办法
这篇文章主要介绍了关于ElementUI el-table 鼠标滚动失灵的问题及解决办法,本文给大家分享问题所在原因及解决方案,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友可以参考下2023-08-08
这篇文章主要介绍了vue.js选中动态绑定的radio的指定项,需要的朋友可以参考下2017-06-06
近期由于公司项目的需要开始研究国密SM4加密,下面这篇文章主要给大家介绍了关于如何使用sm4js进行加密和国密sm4的相关资料,文中通过实例代码介绍的非常详细,需要的朋友可以参考下2023-04-04
这篇文章主要为大家详细介绍了vue树形控件tree的使用方法，文中示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下2022-03-03
本文通过实例代码给大家介绍了vue interceptor 使用,需要的朋友可以参考下2018-09-09
这篇文章主要介绍了vue3向数组插入一条自定义数据实现方式,具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地方,望不吝赐教2025-09-09
Element InfiniteScroll无限滚动的具体使用方法
这篇文章主要介绍了Element InfiniteScroll无限滚动的具体使用方法，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧2020-07-07
这篇文章主要介绍了.eslintrc配置目录及配置项的使用方式，具有很好的参考价值，希望对大家有所帮助。如有错误或未考虑完全的地方，望不吝赐教2022-10-10
最新评论