ESLint란 ES(EcmaScript: 자바스크립트) + Lint를 말하며, 확장성이 좋아 많이 쓰인다.확장성이란 다양한 플러그인을 사용할 수 있기 때문에 새로운 규칙을 추가할 수 있고 손쉽게 다른 회사나 사람의 설정을 도입할 수 있다는 것을 말한다.
Prettier는 vscode의 extension으로 설치했기 때문에 따로 설치할 필요는 없지만, 프로젝트가 팀 단위로 진행되거나 package.json에 확실히 명시를 해두고 싶다면 npm install --save-dev --save-exact prettier 명령어를 통해 설치하면 된다.
그리고 ESLint와 Prettier 규칙의 충돌을 피하고 Prettier 오류를 Lint 에러로 보기 위해서는 eslint-config-prettier와 eslint-plugin-prettier를 설치해주면 된다. 각 패키지는 다음 역할을 한다.
< eslint-config-prettier >
불필요하거나 Prettier와 충돌이(중복이) 일어나는 모든 ESLint의 rules를 무시한다. 자바스크립트 문법 및 코드 품질 검사는 ESLint가, 코드 포맷은 Prettier가 검사하도록 만들어주는 것이다.
eslint-plugin-prettier : Prettier를 ESLint 규칙에 맞게 실행하게 하고 오류를 ESLint의 오류로 나타나게 해주는 기능을 하는 패키지이다. eslint-plugin-prettier 플러그인 설치를 통해 모든 Prettier 규칙 이 ESLint 규칙으로 추가된다고 볼 수 있기 때문에 ESLint 하나만 실행해도 문법검사와 formatting을 함께 실행 시킬 수 있다.
