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 相关文章推荐
兼容Mozilla必须知道的知识。
Jan 09 Javascript
解决表单中第一个非隐藏的元素获得焦点的一个方案
Oct 26 Javascript
JavaScript 语法集锦 脚本之家基础推荐
Nov 15 Javascript
JQuery 弹出框定位实现方法
Dec 02 Javascript
iframe的父子窗口之间的对象相互调用基本用法
Sep 03 Javascript
用RadioButten或CheckBox实现div的显示与隐藏
Sep 21 Javascript
jquery实现select选中行、列合计示例
Apr 25 Javascript
jquery分页插件jquery.pagination.js实现无刷新分页
Apr 01 Javascript
BootStrap入门教程(三)之响应式原理
Sep 19 Javascript
深入理解JavaScript中的块级作用域、私有变量与模块模式
Oct 31 Javascript
使用validate.js实现表单数据提交前的验证方法
Sep 04 Javascript
微信小程序国际化探索实现(附源码地址)
May 20 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动态生成JavaScript代码
2009/03/09 PHP
PHP三层结构(上) 简单三层结构
2010/07/04 PHP
PHP--用万网的接口实现域名查询功能
2012/12/13 PHP
Zend的Registry机制的使用说明
2013/05/02 PHP
PHP实现对站点内容外部链接的过滤方法
2014/09/10 PHP
利用PHP fsockopen 模拟POST/GET传送数据的方法
2015/09/22 PHP
php创建桌面快捷方式实现方法
2015/12/31 PHP
PHP正则匹配操作简单示例【preg_match_all应用】
2017/07/10 PHP
JavaScript延迟加载
2021/03/09 Javascript
优化JavaScript脚本的性能的几个注意事项
2006/12/22 Javascript
JavaScipt基本教程之前言
2008/01/16 Javascript
Javascript的匿名函数小结
2009/12/31 Javascript
JavaScript实现的链表数据结构实例
2015/04/02 Javascript
提高jQuery性能优化的技巧
2015/08/03 Javascript
Jquery uploadify上传插件使用详解
2016/01/13 Javascript
AngularJS表单验证中级篇(3)
2016/09/28 Javascript
jQuery弹出div层过2秒自动消失
2016/11/29 Javascript
Node.js  事件循环详解及实例
2017/08/06 Javascript
JS非空验证及邮箱验证的实例
2017/08/11 Javascript
vue.js多页面开发环境搭建过程
2019/04/24 Javascript
微信小程序实现点击空白隐藏的方法示例
2019/08/13 Javascript
js对象数组和对象的使用实例详解
2019/08/27 Javascript
layui: layer.open加载窗体时出现遮罩层的解决方法
2019/09/26 Javascript
vue-cli和v-charts实现可视化图表过程解析
2019/10/08 Javascript
three.js 制作动态二维码的示例代码
2020/07/31 Javascript
Vue为什么要谨慎使用$attrs与$listeners
2020/08/27 Javascript
Python计算三角函数之asin()方法的使用
2015/05/15 Python
Python映射拆分操作符用法实例
2015/05/19 Python
Python 判断是否为质数或素数的实例
2017/10/30 Python
Python两个字典键同值相加的几种方法
2019/03/05 Python
pytorch中的自定义反向传播,求导实例
2020/01/06 Python
Python sublime安装及配置过程详解
2020/06/29 Python
python 实现的车牌识别项目
2021/01/25 Python
Kaufmann Mercantile官网:家居装饰、配件、户外及更多
2018/09/28 全球购物
Lowe’s加拿大:家居装修、翻新和五金店
2019/12/06 全球购物
酒店司机岗位职责
2013/12/14 职场文书