<aside>
💡 목차
</aside>
ESLint
1. 정의 및 목적
- 자바스크립트 코드의 문제를 식별하고 보고하기 위한 도구
- 정적 분석 도구의 한 형태로, 코드 실행 전에 코드를 검사하여 일반적인 실수, 버그, 스타일 오류, 또는 안티패턴을 찾음
2. 기능
- 규칙 기반 시스템: ESLint는 수많은 규칙을 제공하며, 사용자는 이 규칙들을 켜거나 끌 수 있고, 규칙의 엄격함을 조정
- 플러그인과 확장성: ESLint는 React, Vue, TypeScript 등 다양한 프레임워크와 라이브러리를 지원하기 위해 플러그인을 사용
- 커스터마이징: 프로젝트의 필요에 맞게 규칙을 추가하거나 수정하여 사용자 정의 규칙 생성 가능
- 자동 수정: 일부 규칙 위반에 대해 ESLint는 자동으로 코드를 수정할 수 있는 옵션을 제공
Prettier
1. 정의 및 목적
- 코드 포맷터로, 코드의 기능성에 영향을 주지 않으면서 일관된 스타일을 적용하여 코드를 더 읽기 쉽고 일관적으로 작동하게 하는 도구
2. 기능
- 지원 언어: JavaScript, TypeScript, CSS, HTML, JSON 등 다양한 언어와 파일 형식 지원
- 강제 스타일: Prettier는 스타일에 관한 옵션이 제한적이므로 개발자 간의 스타일 논쟁 축소
단, Prettier가 제시하는 스타일 강제 적용
- 통합: 대부분의 코드 에디터와 IDE에 플러그인 형태로 쉽게 통합할 수 있으며, 저장 시 자동으로 포맷을 적용하도록 설정 가능
3. ESLint와 Prettier 함께 사용하기