빌드 도구 - Linter, ESLint

ESLint

ESLint는 JavaScript 코드에서 발견된 문제 패턴을 식별하기 위한 정적 코드 분석 도구다. 보통 프로그래밍 언어에는 컴파일 과정에서 수행되는 Linter가 기본적으로 내장되어 있지만, 별도의 컴파일 과정 없이 Node나 브라우저에서 바로 실행되는 JavaScript의 경우에는 Linter가 없기 때문에 이 ESLint를 사용해주면 된다.

 

ESLint에서 ES는 Ecma Script, 즉 Ecma라는 기구에서 만든 스크립트인 표준 JavaScript를 말하며, Lint는 소스 코드를 분석하여 프로그램 오류, 버그, 스타일 오류, 의심스러운 구조체에 flag를 다는 것을 말한다.

 

 

사용 방법

1. 설치

npm install -D eslint

 

2. 초기화

.\node_modules\.bin\eslint --init

 

3. 설정

// .eslintrc

{ 
    "env": { 
        "browser": true, 
        "es6": true, 
        "node": true, 
        "jest": true 
        }, 
    "extends": "eslint:recommended", 
    "globals": { 
    	"var1": "readonly", 
        "var2": "writable" 
        }, 
    "parserOptions": { 
    	"ecmaVersion": 6, 
        "sourceType": "module" 
        }, 
    "rules": { 
    	"indent": ["error", 4], 
        "semi": ["error", "always"], 
        "keyword-spacing": 0, 
        "no-unused-vars": 1, 
        "space-before-function-paren": 0, 
        } 
}

 

4. 적용

# 모든 파일의 에러 확인
.\node_modules\.bin\eslint [파일명|디렉토리]

# 모든 파일 수정하기
.\node_modules\.bin\eslint ** --fix

# 확장자 .js 파일만 수정하기
.\node_modules\.bin\eslint **/*.js --fix