[JavaScript] ESLint로 JS 코드 에러 찾기

ESLint 사용하여 컴파일 전에 에러 찾기

npm init @eslint/config@latest

• 다음 명령어로 eslint를 설치한다.
• package.json에 영향을 주지만 package.lock 파일을 생성하거나 yarn.lock 파일에 영향을 주지는 않는다.
• yarn을 사용했어도 걱정하지 말고 다음 명령어를 입력하여 설치해준다.

init ESLint at powershell

• 설치가 완료되면 프로젝트에 eslint.config.js 파일이 생성된다.
• 이 때 확장프로그램에서 eslint를 검색하여 설치해준다.

확장프로그램 ESLint

• 그러면 다음과 같이 사용하지 않는 변수들이 경고가 아니라 에러가 뜬다고 빨간 줄로 위협할 것이다!

그래도 에러만 없다면 실행은 된다.

• 이게 거슬린다면 다음과 같이 설정을 변경하면 된다.

괄호 안에 있는 내용 복사

• 강조된 부분에 마우스 커서를 올려서 eslint의 경고문을 확인한다.
• 괄호 안의 내용을 복사하여 eslint.config.js로 간다.

객체 추가

• pluginJs 머시기 옆에 다음과 같은 객체를 추가해준다.
• 'warn'은 노란 줄로 경고를, 'off'는 경고조차 하지 않게끔 설정한다.
• 빨간 줄로 에러를 표시하고 싶은 경우 'error'를 넣으면 된다.

'no-unused-vars': off

 

• 경고없이 얌전한 것을 볼 수 있다.