为代码提交前加上代码检测
本文讲述的是如何利用三方插件进行代码检测,
准备工作
- 理解eslint的基本用法
- 理解git钩子
- 使用第三方husky,lint-staged
git钩子是什么
git 钩子是git为我们提供的事件的回调,这些文件在 文件的根目录中的
.git/hooks
中大多是.sample
后缀的文件夹,这些都是shell命令,通过出去这个后缀就可触发.git
这个文件需要通过文件夹设置查看隐藏文件就可看到
git官网钩子详情
我们的目的是想在提交前使用eslint来验证能否正确,正确才是其提交这样的话就需要用到pre-commit
这个钩子
husky与lint-staged是什么如何用
husky 是检测钩子函数的一个工具目前最新的是@1.0.1, lint-staged则是检测git暂存区的工具
两者的使用也非常简单:npm i husky lint-staged eslint -D
注意一点,husky在安装的时候会通过你的命令来初始化.git/hooks中的钩子,所以肯定要先让自己的文件受git的控制,假如没被控制只要要git init
就可,假如由于某些起因需要重新初始化,则可以node ./node_modules/husky/lib/installer/bin.js install
或者者重新安装husky这样就能初始化了
配置husky与lint-staged
// package.json// linters中的"src/**/*.js"这个是检测的文件夹可以修改这个的意思是检测src下所有层级的js// 需要注意的lint-staged这个假如报错则创立一个.lintstagedrc把 { "linters" : {...} }放进去就可"scripts": { "precommit": "lint-staged" }, "lint-staged": { "linters": { "src/**/*.js": [ "./node_modules/.bin/eslint --fix", "git add" ] } }
内网中搭建
本次是在内网中搭建的着实麻烦,首先要吧对应的npm包按照层级保存在内网的包中,假如大家公司条件好点可以开代理商或者者白名单,假如和笔主一样苦逼只能通过压缩好了放入这种方式称之为离线安装
,因为husky在初次安装的时候会初始化.git/hooks
中的文件,所以肯定要注意存在.git
否则会不成功,假如通过cnpm 会有下划线开头,也会多一个重复的包,./node_modules/.bin
中的对应的名称与.cmd
的文件也就是下划线的可以通过其内容来恢复
当然每个项目手动去初始化一定是不好的,可以通过在script start 中去初始化与气动项目使用
node ./node_modules/lib/installer/bin.js && 启动你的项目
来操作,这个的意思是先启动前者之后在启动项目,假如是webpack 启动的就要注意不要把初始化放在后面,这样它可能误识别成参数了 。
在启动bin.js 同层级的index.js中可以通过修改源码(不建议,不得已为之)通过使用fs.existsSync(path)
来判断pre-commit能否存在假如不存在就初始化,假如存在了就不做解决这样就完成了一次内网搭建与排除各种小问题
demo非内网
1. 本站所有资源来源于用户上传和网络,如有侵权请邮件联系站长!
2. 分享目的仅供大家学习和交流,您必须在下载后24小时内删除!
3. 不得使用于非法商业用途,不得违反国家法律。否则后果自负!
4. 本站提供的源码、模板、插件等等其他资源,都不包含技术服务请大家谅解!
5. 如有链接无法下载、失效或广告,请联系管理员处理!
6. 本站资源售价只是摆设,本站源码仅提供给会员学习使用!
7. 如遇到加密压缩包,请使用360解压,如遇到无法解压的请联系管理员
开心源码网 » 为代码提交前加上代码检测