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 相关文章推荐
Javascript原型链和原型的一个误区
Oct 22 Javascript
如何使用PHP+jQuery+MySQL实现异步加载ECharts地图数据(附源码下载)
Feb 23 Javascript
BootStrap日期控件在模态框中选择时间下拉菜单无效的原因及解决办法(火狐下不能点击)
Aug 18 Javascript
详解angularjs 关于ui-router分层使用
Jun 12 Javascript
解决JavaScript中0.1+0.2不等于0.3问题
Oct 23 Javascript
全面分析JavaScript 继承
May 30 Javascript
js实现录音上传功能
Nov 22 Javascript
原生js实现文件上传、下载、封装等实例方法
Jan 05 Javascript
jquery实现聊天机器人
Feb 08 jQuery
jQuery 常用特效实例小结【显示与隐藏、淡入淡出、滑动、动画等】
May 19 jQuery
Vue+element-ui添加自定义右键菜单的方法示例
Dec 08 Vue.js
idea编译器vue缩进报错问题场景分析
Jul 04 Vue.js
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
安装docker和docker-compose实例详解
2019/07/30 PHP
js 绑定带参数的事件以及手动触发事件
2010/04/27 Javascript
Javascript单元测试框架QUnitjs详细介绍
2014/05/08 Javascript
一个JavaScript获取元素当前高度的实例
2014/10/29 Javascript
angularjs的一些优化小技巧
2014/12/06 Javascript
JavaScript使用pop方法移除数组最后一个元素用法实例
2015/04/06 Javascript
JQuery插件jcarousellite的参数中文说明
2015/05/11 Javascript
微信小程序 实战小程序实例
2016/10/08 Javascript
Vue.js一个文件对应一个组件实践
2016/10/27 Javascript
jQuery实现背景滑动菜单
2016/12/02 Javascript
vue.js实现含搜索的多种复选框(附源码)
2017/03/23 Javascript
微信小程序页面间通信的5种方式
2017/03/31 Javascript
原生JavaScript实现精美的淘宝轮播图效果示例【附demo源码下载】
2017/05/27 Javascript
vue-resouce设置请求头的三种方法
2017/09/12 Javascript
jquery实现倒计时小应用
2017/09/19 jQuery
vue.js绑定事件监听器示例【基于v-on事件绑定】
2018/07/07 Javascript
详解Vue项目在其他电脑npm run dev运行报错的解决方法
2018/10/29 Javascript
Mpvue中使用Vant Weapp组件库的方法步骤
2019/05/16 Javascript
JavaScript中Dom操作实例详解
2019/07/08 Javascript
Layui表格监听行单双击事件讲解
2019/11/14 Javascript
手机浏览器唤起微信分享(JS)
2020/10/11 Javascript
Linux中安装Python的交互式解释器IPython的教程
2016/06/13 Python
Python操作Sql Server 2008数据库的方法详解
2018/05/17 Python
对python中Json与object转化的方法详解
2018/12/31 Python
把JSON数据格式转换为Python的类对象方法详解(两种方法)
2019/06/04 Python
keras得到每层的系数方式
2020/06/15 Python
Python如何使用27行代码绘制星星图
2020/07/20 Python
python 第三方库paramiko的常用方式
2021/02/20 Python
Bose加拿大官方网站:美国知名音响品牌
2019/03/21 全球购物
Currentbody西班牙:美容仪专家
2019/09/28 全球购物
高中毕业生个人自我鉴定
2013/11/24 职场文书
个人工作总结范文2014
2014/11/07 职场文书
超市督导岗位职责
2015/04/10 职场文书
幼儿园教研工作总结2015
2015/05/12 职场文书
游戏《东方异文石:爱亚利亚黎明》正式版发布
2022/04/03 其他游戏
postgresql中如何执行sql文件
2023/05/08 PostgreSQL