[etc] ESLint

ESLint

ESLint 는 ECMAScript코드에서 문제점을 검사하고 일부는 더 나은 코드로 정정하는 린트 도구 중의 하나이다. 코드의 가독성을 높이고 잠재적인 오류와 버그를 제거해 단단한 코드를 만드는 것이 목적이다 과거 JSLint, JSHint 에 이어서 최근에는 ESLint 를 많이 사용하는 편이다.

코드에서 검사하는 항목을 크게 분류하면 아래 두 가지다.

포멧팅 은 일관된 코드 스타일을 유지하도록 하고 개발자로 하여금 쉽게 읽히는 코드를 만들어 준다. 이를 테면 들여쓰기 규칙 코드 라인의 최대 너비 규칙 을 따르는 코드가 가독성이 더 좋다.

코드품질 은 어플리케이션의 잠재적인 오류나 버그를 예방하기 위함이다. 사용하지 않는 변수 쓰지 않기, 글로벌 스코프 함부로 다루지 않기 등.. 오류 발생 확률을 줄여준다.

린트 도구를 사용해서 코드를 검사하고 더 나아가 단단하고 읽기 좋은 코드를 만드는 방법을 알아보자.

:cupid: 설치 및 사용법

먼저 노드 패키지로 제공되는 ESLint 도구를 다운로드 한다.

$ npm i -D eslint

환경설정 파일을 최상단에 생성한다.

// .eslintrc.js
module.exports = {}

빈 객체로 아무런 설정 없이 모듈만 만들었다. ESLint로 코드를 검사 하면,

$ npx eslint app.js

아무런 결과를 출력하지 않고 프로그램을 종료한다.

:cupid: 정리

읽기 좋은 코드는 유지보수 하기좋다. 그만큼 어플리케이션의 수명은 오래갈 수 있다. 여럿이서 함께 일하는 환경에서 손으로 코드를 관리하는 것은 무척 번거럽고 어쩌면 불가능한 일일지도 모른다. 규칙이 정해졌고 자동화할 수 있다면 도구의 도움을 받는 것이 현명하다.

ESLint는 오류와 버그의 가능성을 찾아 코드 품질을 높이는 역할을 한다. 프리티어는 코드를 일관적으로 포매팅하기 때문에 읽기 수월한 코드를 만들어준다. 이러한 도구를 개발 플로우의 적절한 시점에 통합하여 자동화하면 개발자 좀 더 본질적인 코딩에 집중할 수 있을 것이다.

:cupid: ref

참고링크