머리말
팀 개발에서 프론트 엔드 (JS, CSS, HTML) 또는 백엔드를 작성하든 종종 팀의 코드 스타일을 통합하는 방법을 해결해야합니다. 이 기사는 주로 사전 git, eslint 및 js-beautify를 사용하여 코드 스타일 컨트롤을 구현합니다.
다음은 세 가지 도구와 사용 방법입니다.
사전 git
이 도구는 GIT 후크의 기능을 구현하고 커밋 전에 코드 감지 실행과 같은 GIT 프로세스에 몇 가지 사용자 정의 동작을 삽입하고 통과하지 않으면 오류 가보고됩니다.
eslint
코드 형식 감사 도구는 다양한 스타일을 결합하고 구성하여이를 사용하여 팀의 통합 코드 사양을 형성 할 수 있습니다.
JS-Beautiful
JS 코드 조직 및 미화 도구.
그런 다음 세 가지 도구가 서로 협력하여 다음 효과를 만듭니다.
1. 프로젝트 리더는 ESLINT의 코드 사양을 정의합니다.
2. 프리-git을 사용하여 Commit 전에 Eslint 코드 모니터링 및 JS-Beautiful Code 미화를 실행하십시오.
3. 통과하면 자동으로 "git add". 밀 수 있습니다.
성취하다
1 : NPM 위의 도구를 설치하십시오
$ npm install eslint js-beautify pre-git --save-dev
둘 : 도구 구성
루트 디렉토리에서 새 .eslintrc.json 파일을 만들고 사양을 구성하고 단순화 된 버전을 제공합니다.
참고 : 더 많은 테스트가 필요한 경우 Eslint 공식 웹 사이트를 방문하십시오.
{ "규칙": { "comma andangle": [ "error", "never"], "Arrow-Body 스타일": [ "Warn", "Always"], "no-const-assign": [ "error"]}, "parseroptions": { "ecmaversion": 6}}테스트로 인해 Bash에서 JS-Beautiful Recursive Multi-Layer 파일을 사용할 때는 항상 오류가 있으므로 스크립트는 코드를 아름답게하는 데 사용됩니다.
Beatufyjs.js
const fs = require ( 'fs'); const path = require ( 'path'); const child_process = require ( 'child_process'); for (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 -e -e -j-a $ {pathname} -r`, function (error, msg, msg, stderr) {console.log. msg.replace ( '/// n', ''); } else {read_dir (pathname); }} 함수 read_dir (dir) {let files = fs.readDirsync (dir); for (파일의 파일) {let pathname = path.join (dir, file); if (isfile (pathname)) {child_process.exec (`./node_modules/js-beautify/js/bin/js-beautify.js -e -j -a $ {pathname} --r`, function (error, msg, stderr) {console.log (msg.replace)); } else {read_dir (pathname); }}} 함수 isfile (path) {return ensists (path) && fs.statsync (path) .isfile (); } 함수가 존재합니다 (경로) {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 louttes runtime utils libs -quiet", "lint-fix" libs --quiet-fix ","js-beautify ":"노드-harmony-use_strict ./bin/beatufyjs.js libs middlewares index.js "},"kelvv ","kelvv ","라이센스 ":"isc ":"pre-git ":" "necond": "", ":" ":": "": ":" ":": Lint-Fix ","NPM Run JS-Beautify ","Git Add ". ], "pre-push": [], "post-commit": [], "post-checkout": [], "post-merge": []}}, "devddependencies": { "eslint": "^2.12.0", "js-beautify": "^1.6.3", "pre-git": "^9.1"}현재 파일 중 하나를 수정 한 다음 "git add && git commit -m 'msg'"를 수정하면 사전 커밋의 세 가지 명령이 실행됩니다. 중간에 오류가 발생하면 제출이 중지되고 수정이 완료된 후에 제출이 계속됩니다.
한 가지 주목할 점은 일부 형식 문제가 오류를보고하기에 충분하지 않으면 수정 방법이 최적화 코드를 자동으로 수정하고 자동으로 추가 및 수정한다는 것입니다. 마지막 단계에서, 그냥 실행 : git push ! 더 나은 단위 테스트와 결합 할 수 있습니다
요약
위는 Node.js를 사용하여 팀의 코드를 자동으로 검토하는 방법의 모든 내용입니다. 필요한 경우 참조 할 수 있습니다.