为代码提交前加上代码检测
来源:coderLfy     阅读:642
二分熟
发布于 2018-10-02 23:00
查看主页

本文讲述的是如何利用三方插件进行代码检测,

准备工作

  1. 理解eslint的基本用法
  2. 理解git钩子
  3. 使用第三方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非内网

免责声明:本文为用户发表,不代表网站立场,仅供参考,不构成引导等用途。 系统环境 服务器应用
相关推荐
【视频下载软件】Downie 3 for Mac中文破解版3.6(1944)
一文了解 Apache Hadoop 机架感知
前台面试每日3+1(周汇总2020.01.26)
猎豹傅盛:机器人从不是噱头 更不是黑科技
HTML5课程预热——HTML5详情及HTML5发展前景
首页
搜索
订单
购物车
我的