前言
在團隊開發中,無論是寫前端(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自動審核團隊的代碼的全部內容,有需要的可以進行參考學習。
新聞熱點
疑難解答