ESLint & Prettier
Prettier는 formatter고 eslint는 linter이다.
포맷터는 스타일을 교정하는 역할, 린터는 오류를 잡는 역할을 수행한다.
ESLint와 Prettier 같이 사용하기
Linter 룰은 크게 포맷팅(스타일) 룰과 코드 퀄리티 룰로 나눌 수 있다. 포맷팅 룰이 Prettier와 역할이 겹치기 때문에 충돌이 날 수 있고 아래와 같은 3가지 방법이 있다고 한다.
eslint-config-prettier ✅
- eslint에서 prettier와 충돌할 수 있는 rule을 꺼버림
- 코드 오류를 잡는데는 eslint, 코드 포맷팅에는 prettier를 사용하는 방법이다.
eslint-plugin-prettier
- prettier를 eslint의 rules로 동작하게 함
- 포맷팅 문제도 오류로 출력되어서 오류 메시지가 지나치게 많아지며 느리다.
prettier-eslint
- prettier를 실행하고 나서 eslint —fix를 실행함
- prettier를 단독으로 실행하는 것 보다 훨씬 느리다.
Prettier에서 공식적으로 1번 방법을 권장하기 때문에 대부분의 케이스에서 eslint-config-prettier 방법을 사용한다.
jjlabsio