[typescript] Prettier와 Node.js 프로젝트 통합하기

08 Dec 2023

typescript

Prettier는 코드 포맷팅 도구로, 코드의 가독성을 높이고 일관성을 유지하는 데 도움을 줍니다. Node.js 프로젝트에서 Prettier를 사용하여 코드를 자동으로 서식을 맞추는 방법을 알아봅시다.

Prettier란?

Prettier는 JavaScript, TypeScript, CSS, JSON 등 다양한 언어의 코드 포맷팅을 지원하는 도구로, 설정 가능한 규칙을 사용하여 코드를 자동으로 정리해줍니다. 이를 통해 개발자들은 일관된 코드 스타일을 유지하고 코드 포맷팅에 소요되는 시간을 줄일 수 있습니다.

Node.js 프로젝트에 Prettier 통합하기

단계 1: Prettier 설치

먼저 프로젝트 디렉토리에서 Prettier를 설치합니다.

npm install --save-dev prettier

단계 2: Prettier 환경 설정

프로젝트 루트 디렉토리에 .prettierrc 파일을 만들고, Prettier 설정을 추가합니다.

{
  "semi": false,
  "singleQuote": true,
  "tabWidth": 2,
  "printWidth": 80
}

이렇게 함으로써 Prettier의 구성을 프로젝트에 적용할 수 있습니다.

단계 3: Prettier 실행

Prettier는 CLI나 IDE 플러그인을 통해 실행할 수 있습니다. CLI를 통해 실행하려면 다음과 같이 명령어를 사용합니다.

npx prettier --write .

위 명령어는 프로젝트 내의 모든 파일에 Prettier를 적용하여 코드를 정리합니다.

단계 4: Prettier와 프로젝트 통합

프로젝트의 코드 베이스에 Prettier를 통합하려면 자동으로 코드를 정리해주는 훅(hook)이나 스크립트를 설정할 수 있습니다. 예를 들어, Git hook을 사용하여 커밋하기 전에 코드를 정리하도록 설정할 수 있습니다.

결론

Prettier는 Node.js 프로젝트에서 코드를 일관된 형태로 유지하는 데 큰 도움이 됩니다. 이를 통해 개발자들은 코드 포맷팅에 소요되는 시간을 최소화하고, 일관된 코드 스타일을 유지할 수 있습니다. Prettier를 프로젝트에 통합하여 개발 생산성을 향상시키는 것이 좋습니다.