基于git diff进行的eslint代码检测

Yangder 发布于2019-08-20 10:17 / 1398人阅读

摘要：缘起在项目中，通常都会使用代码检测工具来规范团队的代码风格，比如。随着代码的不断增加，进行代码检测的时间也越来越久。每次检测的时候，需要检测的文件和实际检测的文件极度不对称，所以便基于写了这样一个小工具。

缘起

在项目中，通常都会使用代码检测工具来规范团队的代码风格，比如eslint。随着代码的不断增加， eslint进行代码检测的时间也越来越久。每次检测的时候，需要检测的文件和实际检测的文件极度不对称，所以便基于git diff写了这样一个小工具。

2016/11/02更新

由于之前对于一系列的命令不够熟悉，在脚本中同时使用了nodejs和bash，并且通过文件来传递信息，以下为改良后版本，纯bash.

#!/bin/bash
INFO="33[36m";
NOR="33[0m";
ERR="33[31m";
br="dev";
echo -e "${INFO}run lint now ... just wait a moment ...${NOR}";
if [ $1 ]; then
  br=$1;
fi;

log=`git diff origin/${br} --name-only | grep js | grep src/`;
if [ -z "${log}" ]; then
  echo -e "${INFO}No file changed, exit now ${NOR}";
  exit 0;
fi;
node ./node_modules/eslint/bin/eslint.js $log | grep error -C 1000 --color=auto;

源代码

启动脚本(lint.sh)

#!/bin/bash
INFO="33[36m";
NOR="33[0m";
ERR="33[31m";
br="dev";
echo -e "${INFO}run lint now ... just wait a moment ...${NOR}";
if [ $1 ]; then
  br=$1;
fi;

git diff origin/${br} > diff.log;
log=`cat diff.log | grep "diff --git a/src"`;
if [[ -z ${log} ]]; then
  echo -e "${INFO}没有文件发生变化${NOR}";
else
  echo "";
  node ./lint-by-diff.js;
  echo -e "${INFO}done ...${NOR}";
fi;
rm diff.log change.log 2> /dev/null
read;

检测工具(lint-by-diff.js)

const fs = require("fs");
const shelljs = require("shelljs");

const jsFiles = [],
  LOG__PATH   = "./diff.log",
  FILE = /diff --git a([sS]*?) /g,
  data = fs.readFileSync(LOG__PATH).toString(),
  _files = data.match(FILE),
  len = _files.length;

let i = 0;
while (i < len) {
  const _item = _files[i++].trim();
  if (!/.js$/.test(_item)) continue;
  const item = "./" + _item.slice(13);
  if (!/^./src//.test(item)) continue; // src为eslint需要检测的顶级目录
  if (!fs.existsSync(item)) continue;
  jsFiles.push(item);
}
if (jsFiles.length === 0) {
  console.log("没有文件发生变化");
  console.log("");
  process.exit(1);
}
console.log("------------------------------");
console.log("     以下文件发生改变： ");
console.log(jsFiles.join("
"));
console.log("------------------------------");
shelljs.exec("node ./node_modules/eslint/bin/eslint.js " + jsFiles.join(" "));

原理

通过git diff origin/dev获取到和dev分支的不同，从而知道哪些文件需要进行代码检测（dev上的是通过检测的），然后运行eslint的时候就指定这部分文件。

使用

在项目根目录下输入./lint.sh或者bash ./lint.sh, 默认的远程分支是dev，如果需要和其他分支比较的话，指定远程分支名，比如./lint.sh master

不足

使用了bash, 导致这个看起来有点不伦不类，使用纯js也许会更好，但是我毕竟半吊子→＿←

没有对error进行高亮显示，所以看起来还是会比较费力

云服务器 GPU云服务器基于异常的入侵检测基于网络的入侵检测基于主机的入侵检测基于opencv的人脸检测

文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。

转载请注明本文地址：https://www.ucloud.cn/yun/80073.html

pre-commit钩子，代码质量检查

摘要：目前基本使用三款代码质量检查工具。使用脚本检查，可以参考里面如何使用文件名是在之前启用的钩子函数，利用查看当前有哪些文件修改过，只对指定文件夹中修改的文件使用进行代码检查，渐进式对整个项目实现代码规范。目前基本使用三款js代码质量检查工具： jslint, jshint, eslint。许多IDE里面也有对应的检查插件，在每次ctrl + s 保存文件的时候，检查当前文件是否符合规范...

stefanieliang 2019-08-02 11:46 评论0 收藏0
pre-commit钩子，代码质量检查

摘要：目前基本使用三款代码质量检查工具。使用脚本检查，可以参考里面如何使用文件名是在之前启用的钩子函数，利用查看当前有哪些文件修改过，只对指定文件夹中修改的文件使用进行代码检查，渐进式对整个项目实现代码规范。目前基本使用三款js代码质量检查工具： jslint, jshint, eslint。许多IDE里面也有对应的检查插件，在每次ctrl + s 保存文件的时候，检查当前文件是否符合规范...

Prasanta 2019-08-23 12:26 评论0 收藏0
前端构建之webpack

摘要：前端构建之之前写了一个前端构建之，同样的目的写一个，内容基本上和一样，主要用来自己学习记录。合并很方便的实现合并最后附上完整的源代码。前端构建之webpack 之前写了一个前端构建之gulp，同样的目的写一个webpack，内容基本上和gulp一样，主要用来自己学习记录。为什么需要前端构建不解释本文大致分为以下几个内容：规范校验js代码（jslint） js解释器（b...

MartinHan 2019-08-26 12:00 评论0 收藏0
vue和react的差异

摘要：而中实现原理是利用高阶函数通过将多个函数组合成一个可执行执行函数关键步骤代码如下所示。和都是基于更新差异元素。引言平时开发单页项目应用基于vue,目前另外两个比较热的库还有angular和react,angular 1系列用过,进入公司后由于基于vue技术栈就没在关注了。一直在关注react,目的不是学习用法,只是为了拓展自己的视野和思维,通过了解一些使用上的差异性,来进一步的思考...

OnlyLing 2019-08-21 17:47 评论0 收藏0