ESLint

개념

ESLint는 ECMAScript 코드에서 문법적 오류나 더 나은 코드로 정정하는 린트 도구 이다. 즉, 코드의 가독성을 높이고 오류와 버그를 제거하여 단단한 코드를 만드는 것이 목적이다.

 

 

사용법

npm install eslint 로 설치한다. ESLint또한 별도의 설정파일이 필요하므로 .eslintrc.js 파일을 만들어 준다. 설정파일에 규칙(Rules)를 추가해야만 코드를 검사할 수 있다. 해당 규칙은 eslint.org/docs/rules/

List of available rules

여기서 확인이 가능하다. 

 

// .eslintrc.js

module.exports = {
  rulues: {
    'no-unexpected-multiline': 'error',
  },
}

 

 

Extensible Config

ESLint엔 여러 규칙들이 있는데, eslint에서 미리 정해 놓은 설정들이 있다. eslint의 규칙들을 보면 왼쪽에 체크 표시가 되어 있는 것들이 eslint:recommended 에 활성화 되어 있는 규칙이다. 이 외의 설정이 더 필요하다면 rules 속성에 추가해서 사용하면 된다. 

 

// .eslintrc.js

module.exports = {
  extends: ['eslint:recommended']
}

 

 

초기화

이러한 설정들은 --init 옵션을 추가하면 더 쉽게 설정할 수 있다. npx eslint --init 명령어를 실행하면

위와 같이 몇가지 설정을 할 수 있게 된다. 그럼 자동으로 설정파일이 만들어 진다.

 

// .eslintrc.js

module.exports = {
  env: {
    browser: true,
    es2021: true,
    node: true,
    amd: true,
  },
  extends: 'eslint:recommended',
  parserOptions: {
    ecmaVersion: 12,
    sourceType: 'module',
  },
  rules: {},
}