ESLint?

H·2023년 1월 4일
0

Basic

목록 보기
3/5

코드의 가독성을 높이고 잠재적인 오류와 버그를 제거해 단단한 코드를 만드는 것이 목적이며, 필요 방식에 따라 사용자 정의를 할 수 있어 협업, 프로젝트시 일관성 유지에 유용합니다.

linter는 소스코드를 분석해서 문법 에러, 버그를 찾고 보고해주는 도구를 말합니다.

코드를 실행하기 전에 버그를 찾거나, 괄호나 스페이스의 사용방법 등의 스타일을 통일하거나 하는 것에 도움이 되며,자바스크립트에서 쓸 수 있는 linter는 JS Lint, JS Hint, ESlint 등 있으며, 이중 가장 인기가 많은 것이 ESlint 입니다.

ESlint는 보고만 해주는 것이 아니라, 고쳐주기까지 해서 규칙을 자신의 상황에 맞게 바꿀 수도 있어 좋습니다.

1. 문제 찾기

ESLint는 당신의 코드를 정적으로 분석하여 신속하게 문제를 찾아내고, ESLint는 대부분의 텍스트 편집기에 내장되어 있으며, ESLint를 지속적인 통합 파이프라인의 일부로 실행할 수 있습니다.

2. 자동으로 수정

ESLint가 발견한 많은 문제들은 자동으로 고쳐질 수 있습니다.
ESLint 수정은 구문을 인식 하므로 기존의 검색 및 교체 알고리즘에서 발생한 오류를 경험하지 않을 것 입니다.

3. 사용자 정의

코드를 사전 처리하고, 사용자 지정 파서를 사용하고, ESLint의 기본 제공 규칙과 함께 작동하는 규칙을 작성합니다. ESLint를 프로젝트에 필요한 방식으로 정확하게 작동하도록 사용자 지정할 수 있습니다.

ESLint 검사 항목 두 가지

1) 코드 포맷팅 - 일관된 코딩 컨벤션을 유지하는 기능

포맷팅은 일관된 코드 스타일 유지: "들여쓰기 규칙", "최대 너비 규칙"등

2) 코드 품질 - 잠재적인 오류를 찾아주는 기능

코드 품질은 잠재적 오류나 버그를 예방하며,

사용하지 않는 변수 제거, 글로벌 스코프 함부로 다루지 않기 등 오류발생 확률을 줄여 줍니다.

ESLint 설치

npm i eslint -D
npx eslint --init

생성된 .eslintrc.json 파일 확인

참고, 인용

비실이의 메모용지 : 네이버 블로그

[Mac/VSCODE] ESLint, Prettier, Husky, Lint-staged 설정

profile
비전공이지만 괜찮아

0개의 댓글