Prettier & ESLint

Prettier

Code Formatter이다. 개발자들에게 일관적인 코딩 스타일을 유지할 수 있게 도와주는 툴이다.

⇒ 코드 스타일을 교정

 

ESLint

javascript는 프로그램을 직접 실행하여 코드를 분석하는 동적분석(<=>프로그램을 실행하지 않고 분석하는 정적분석) 방식을 사용한다. 에러를 찾기 위해서는 코드를 실행시켰어야하기 때문에 Linter가 정적분석을 도와 프로그램을 실행하지 않고도 코딩 컨벤션에 위배되는 코드를 자동으로 검출해준다. 추가로 간단한 코드 포맷팅(코드 표준 적용) 기능이 있다.

⇒ 문법에러 잡아주거나 더 좋은 문법을 사용하게 에러표기를 강제해줌.

---

Prettier는 코드가 예쁘게 보이도록 하는것에 중점. 코드 에러를 잡아내진 못함

⇒ 포맷팅

ESLint 코드 포맷터 + 주로 코드 에러 잡아냄 + 코드 문법을 강제하는 등 코드 품질 개선

⇒ 코드 에러와 문법을 정적으로 탐지할때 사용

 

 

issue

• ESLint가 코드 포맷터 역할도 하기 때문에 Prettier와 충돌할 수 있다. 따라서 패키지를 추가해준다.
• ⇒ eslint-config-prettier 패키지는 ESLing 규칙에서 Prettier규칙과 충돌하는 규칙들을 OFF시킴.

 

---

[참고]https://soojae.tistory.com/39

 

https://promm.dev/tool/prettier-eslint/