ESLint

yoeubi
3 min readMay 17, 2020

--

※인프런의 “프론트엔드 개발환경의 이해와 실습”을 공부하고 정리한 포스트입니다.※

ESLint는 사전에 코드를 체크할때 사용한다.

  1. 일관된 코드 스타일을 유지하는 포맷팅
  2. 잠재적 오류나 버그를 예방하는 코드 품질

위 2가지를 ESLint가 담당하는 일이다.

설치

마지막 코드를 실행시켜도 아무런 콘솔출력이 되지 않는다.

ESLint를 사용할려면 Config 파일이 필요하다.

규칙

ESLint는 Rules로 검사 규칙을 만들어 놓았다.

이러한 Rule 중에서 자동 수정이 가능한 규칙들이 존재한다.

자동 수정이 가능한 규칙들은 렌치 아이콘을 가지고 있다.(ESLint 홈페이지에서 확인할 수 있다.)

이렇게 — fix 옵션을 달면 자동으로 수정한다.

Extends

이렇게 필요한 규칙들을 일일이 세팅하는 방법도 있지만 이미 필요한 규칙들을 하나의 세트처럼 해놓은게 있다.

eslint:recommended 라는 규칙 세트를 extends에 설정하고 추가하고 싶은 rule은 rules 속성에 추가해서 확장할 수 있다.

초기화

위 명령어를 실행하면 대화형으로 추가옵션을 물어본다.

선택에 따라서 .eslintrc 파일을 자동으로 생성해준다.

--

--

yoeubi
yoeubi

Written by yoeubi

Junior Frontend engineer

No responses yet