[Node.js] ESLint란? / ESLint 사용법

ESLint란?

ES(javascript) + Lint(오류검사기)

javascript코드를 실행하지 않고도, 오류를 발견해 알려주는 Node.js 패키지

( Typescript도 가능! - javascript 기반이므로 )

 

ESLint 설치

# 현재 폴더에 설치

# -d : package.json의 devDependencies에 추가한다

npm i -d eslint

# 컴퓨터에 설치

npm i -gd eslint

 

ESLint 설치 확인, 버전 확인

# 현재 폴더에 설치되어있을 때

node_modules/.bin/eslint -v

# 컴퓨터에 설치되어있을 때

eslint -v

 

ESLint 설정파일 만들기 ( .eslintrc.json )

// 로컬

node_modules/.bin/eslint --init


// 컴퓨터

eslint --init



실행시 선택지

1. How would you like to use ESLint? ( 어디에 ESLint를 사용하실 건가요? )

> To check syntax only ( 문법 오류만 체크 )
> To check syntax and find problems ( 문법 오류, 에러 체크 )
> To check syntax, find problems, and enforce code style ( 문법 오류, 에러 체크, 코드 예쁘게 정리 )


2. What type of modules does your project use? ( 어떤 타입의 모듈을 사용하실 건가요? )

> Javascript modules (import/export) ( 자바스크립트 모듈 형식 )
> CommonJS (require/exports) ( 바닐라 자바스크립트 형식 )
> None of these ( 설정안함 )


3. Which framework does your project use? ( 어떤 프레임워크를 사용하시나요? )

> React
> Vue.js
> None of these ( 설정안함 )


4. Does your project use Typescript? ( 타입스크립트를 사용하시나요? )

> No / Yes


5. Where does your code run? ( 코드가 어떤 환경에서 실행되나요? )

> Browser ( 브라우저 )
> Node ( Node.js )


6. What format do you want your config file to be in? ( 설정파일을 어떤 형식으로 만들까요? )

> Javascript
> YAML
> JSON


7. Would you like to install them now with npm? ( 지금바로 npm으로 설치할까요? )

> No / Yes

 

ESLint 사용하기!

eslint <적용할파일>

# eslint test.js
# test.js를 검사하여, 오류가 없는지 확인해준다!

 

세미콜론 오류 검사, 자동수정! ( .eslintrc.json )

// eslint 설정파일(.eslintrc.json) 수정
// rules에 규칙만들기!
// "semi" : 세미콜론오류 감지해서, 오류를 출력

{
    "rules":{
        "semi": "error"
    }
}


// --fix : rule에 따라 자동 수정하기
eslint test.js --fix

 

특정 파일 ESLint 에서 제외시키기 ( .eslintignore )