Node.js如何自动审核团队的代码


Posted in Javascript onJuly 20, 2016

前言

在团队开发中,无论是写前端(js,css,html) ,还是后端 ,我们常常需要解决一个问题:如何统一团队代码风格。 这篇文章主要是使用pre-git , eslint , js-beautify 实现代码风格控制。

下面分别介绍这三个工具和使用方式:

pre-git

该工具能实现git hook的功能,在git的流程中插入一些自定义行为,例如commit之前执行代码检测,如果不通过则报错。

eslint

代码格式审核工具,可以随意组合配置各种风格,用于组成团队的代码统一规范。

js-beautiful

js代码整理、美化工具。

然后这三个工具互相配合就形成了以下效果:

1.项目组长定义好eslint的代码规范。

2.使用pre-git在commit之前运行eslint代码监测和js-beautiful代码美化

3.如果通过则自动"git add ." ,最后允许push。

实现

一:npm安装上述工具

$ npm install eslint js-beautify pre-git --save-dev

二:工具的配置

在根目录新建.eslintrc.json文件,并且把规范配置好,一下给一个精简版:

注意:如需更多检测,请到eslint官网查看

{
  "rules": {
    "comma-dangle": ["error", "never"],
    "arrow-body-style": ["warn", "always"],
    "no-const-assign": ["error"]
    },
  "parserOptions": {
    "ecmaVersion": 6
  }
}

因测试,bash 中使用js-beautiful递归多层文件的时候总出现错误,所以由一脚本来进行代码美化:

beatufyjs.js

const fs = require( 'fs' );
const path = require( 'path' );
const child_process = require( 'child_process' );

for( let arg of process.argv.splice( 2 ) ) {
  let pathName = path.join( process.cwd(),arg );
  if( isFile( path.join( process.cwd(),arg ) ) ) {
    child_process.exec( `./node_modules/js-beautify/js/bin/js-beautify.js -P -E -j -a ${pathName} -r` , function( error, msg, stderr ) {
      console.log( msg.replace('\\\\n','') );
    } );
  } else {
    read_dir( pathName );
  }
}

function read_dir( dir ){
  let files = fs.readdirSync( dir );
  for( let file of files ) {
    let pathName = path.join( dir,file );
    if( isFile( pathName ) ) {
      child_process.exec( `./node_modules/js-beautify/js/bin/js-beautify.js -P -E -j -a ${pathName} -r` , function( error, msg, stderr ) {
        console.log( msg.replace( '\\\\n','') );
      } );
    } else {
      read_dir( pathName );
    }
  }
}

function isFile( path ){ 
  return exists( path ) && fs.statSync( path ).isFile(); 
} 

function exists( path ){ 
   return fs.existsSync( path ) || path.existsSync( path ); 
}

三:使用上述工具

在package.json文件中配置:

{
 "name": "demo",
 "version": "1.0.0",
 "description": "",
 "main": "index.js",
 "scripts": {
  "lint": "./node_modules/.bin/eslint routes runtime utils libs --quiet",
  "lint-fix": "./node_modules/.bin/eslint routes runtime utils libs --quiet --fix",
  "js-beautify": "node --harmony --use_strict ./bin/beatufyjs.js libs middlewares index.js "
 },
 "author": "kelvv",
 "license": "ISC",
 "config": {
  "pre-git": {
   "commit-msg": "",
   "pre-commit": [
    "npm run lint-fix",
    "npm run js-beautify",
    "git add ."
   ],
   "pre-push": [],
   "post-commit": [],
   "post-checkout": [],
   "post-merge": []
  }
 },
 "devDependencies": {
  "eslint": "^2.12.0",
  "js-beautify": "^1.6.3",
  "pre-git": "^3.9.1"
 }
}

此时当你修改其中一个文件,然后"git add && git commit -m 'msg' "的时候,pre-commit中的三条命令就会执行,如果中途有错就会停止提交,修改完毕后再继续提交。

有一点需要注意的是,有的格式问题不足以报错的话,改方法会自动修改优化代码,并且自动添加修改,最后一步,执行:git push即可!可以结合单元测试,更佳

总结

以上就是为大家整理的如何用Node.js自动审核团队的代码的全部内容,有需要的可以进行参考学习。

Javascript 相关文章推荐
jquery radio 操作代码
Mar 16 Javascript
仅30行代码实现Javascript中的MVC
Feb 15 Javascript
JavaScript的MVVM库Vue.js入门学习笔记
May 03 Javascript
js流动式效果显示当前系统时间
May 16 Javascript
jQuery短信验证倒计时功能实现方法详解
May 25 Javascript
深入理解Angular.JS中的Scope继承
Jun 04 Javascript
JavaScript 完成注册页面表单校验的实例
Aug 19 Javascript
JavaScript使用享元模式实现文件上传优化操作示例
Aug 07 Javascript
微信小程序中如何使用flyio封装网络请求
Jul 03 Javascript
JS实现水平移动与垂直移动动画
Dec 19 Javascript
微信小程序图片自适应实现解析
Jan 21 Javascript
JS实现数组去重的11种方法总结
Apr 04 Javascript
js只执行1次的函数示例
Jul 20 #Javascript
JQuery为元素添加样式的实现方法
Jul 20 #Javascript
JCrop+ajaxUpload 图像切割上传的实例代码
Jul 20 #Javascript
javaScript给元素添加多个class的简单实现
Jul 20 #Javascript
JavaScript中数组的22种方法必学(推荐)
Jul 20 #Javascript
JavaScript DOM 对象深入了解
Jul 20 #Javascript
JavaScript中的splice方法用法详解
Jul 20 #Javascript
You might like
PHP安装全攻略:APACHE
2006/10/09 PHP
总结PHP如何获取当前主机、域名、网址、路径、端口和参数等
2016/09/09 PHP
如何用javascript控制上传文件的大小
2006/10/26 Javascript
Firefox和IE浏览器兼容JS脚本写法小结
2008/07/07 Javascript
用JS判断IE版本的代码 超管用!
2011/08/09 Javascript
Js如何判断客户端是PC还是手持设备简单分析
2012/11/22 Javascript
JAVASCRIPT模式窗口中下载文件无法接收iframe的流
2013/10/11 Javascript
使用jquery解析XML示例代码
2014/09/05 Javascript
利用原生JavaScript获取元素样式只是获取而已
2014/10/08 Javascript
JS之相等操作符详解
2016/09/13 Javascript
canvas绘制的直线动画
2017/01/23 Javascript
angularjs使用directive实现分页组件的示例
2017/02/07 Javascript
JavaScript事件委托原理与用法实例分析
2018/06/07 Javascript
详解Vue中CSS样式穿透问题
2019/09/12 Javascript
使用p5.js临摹动态图片
2019/11/04 Javascript
JavaScript变量基本使用方法实例分析
2019/11/15 Javascript
如何解决jQuery 和其他JS库的冲突
2020/06/22 jQuery
Angular+ionic实现折叠展开效果的示例代码
2020/07/29 Javascript
微信小程序 接入腾讯地图的两种写法
2021/01/12 Javascript
[05:17]DOTA2睡衣妹卖萌求签名 CJ第二天全明星影像
2013/07/28 DOTA
[01:14]辉夜杯战队访谈宣传片—NEWBEE.Y
2015/12/26 DOTA
python中的实例方法、静态方法、类方法、类变量和实例变量浅析
2014/04/26 Python
用Python中的wxPython实现最基本的浏览器功能
2015/04/14 Python
Windows系统下多版本pip的共存问题详解
2017/10/10 Python
python生成器与迭代器详解
2019/01/01 Python
python从入门到精通 windows安装python图文教程
2019/05/18 Python
Python如何基于Tesseract实现识别文字功能
2020/06/05 Python
日本整理专家Marie Kondo的官方在线商店:KonMari
2020/06/29 全球购物
本科生详细的自我评价
2013/09/19 职场文书
在校生钳工实习自我鉴定
2013/09/19 职场文书
《青山处处埋忠骨》教学反思
2014/04/22 职场文书
离婚协议书样本
2015/01/26 职场文书
唐山大地震的观后感
2015/06/05 职场文书
八月一日观后感
2015/06/10 职场文书
中学图书馆工作总结
2015/08/11 职场文书
Linux服务器离线安装 nginx的详细步骤
2022/06/16 Servers