더북(TheBook)

1.5 ESLint와 Prettier

자바스크립트 코드를 작성할 때 개발자 취향에 따라 다르게 사용하는 코드 규칙들이 있습니다. 예를 들어, 들여쓰기할 때 탭을 쓸지, 스페이스를 쓸지, 또 스페이스를 쓴다면 몇 칸을 쓸지 딱 정해진 규칙이 없습니다. 그리고 코드 뒷부분에 세미콜론(;)을 사용해도 되고, 사용하지 않아도 됩니다. 문자열을 입력할 때 큰따옴표(")를 사용해도 되고 작은따옴표(')를 사용해도 됩니다. 또한, 자바스크립트는 컴파일해서 사용하는 언어가 아니다 보니 선언되지 않은 함수나 값을 사용할 때 에디터에서 따로 오류가 발생하지 않습니다.

이때 자바스크립트의 코드 규칙을 일관성 있게 작성하고, 잠재적인 코드 실수를 방지하는 도구가 있는데, 바로 ESLint입니다. ESLint는 사전에 정해진 규칙 및 잠재적인 실수가 발견되면 경고 또는 오류를 보여줍니다. 앞에서 잠깐 언급한 Prettier라는 도구도 있습니다. 앞에서 언급한 들여쓰기, 세미콜론, 따옴표 등의 규칙을 한번에 정리해줍니다.

이 도구들은 VS Code에서 확장 프로그램으로 연동해 사용할 수 있습니다. VS Code 좌측의 최하단 아이콘을 누르세요. 그리고 ESLint와 Prettier를 검색해 맨 위에 나타나는 확장 프로그램을 설치하세요.

신간 소식 구독하기
뉴스레터에 가입하시고 이메일로 신간 소식을 받아 보세요.