Prettier는 코드 포맷팅 도구로, 일관된 코드 스타일을 유지하고 코드베이스의 가독성을 높이는 데 도움이 됩니다. Prettier의 설정을 이해하고 적절히 구성함으로써 프로젝트에 적합한 코드 포맷팅을 쉽게 적용할 수 있습니다.

설정 파일

Prettier는 .prettierrc나 prettier.config.js와 같은 설정 파일을 통해 설정을 관리합니다. 설정 파일을 사용하면 코드 스타일을 일관되게 유지하고 프로젝트 전체에 일관성을 부여할 수 있습니다.

핵심 설정 항목

Prettier 설정의 핵심 항목을 이해하고 적절히 구성하는 것이 중요합니다.

printWidth

이 항목은 한 줄의 최대 길이를 정의합니다. 너무 긴 줄을 자동으로 줄바꿈하여 가독성을 높일 수 있습니다.

tabWidth

들여쓰기에 사용할 스페이스의 개수를 정의합니다.

semi

세미콜론 사용 여부를 결정합니다.

singleQuote

작은따옴표 또는 큰따옴표 사용 여부를 결정합니다.

trailingComma

마지막 요소 뒤에 쉼표를 추가할지 여부를 결정합니다.

bracketSpacing

객체 리터럴이나 배열 리터럴에서 중괄호 안에 공백을 추가할지 여부를 정의합니다.

arrowParens

화살표 함수의 인자가 단일 인자인 경우 괄호를 생략할지 여부를 결정합니다.

설정 예시

다음은 .prettierrc 파일의 예시 설정입니다.

{
  "printWidth": 80,
  "tabWidth": 2,
  "semi": true,
  "singleQuote": true,
  "trailingComma": "all",
  "bracketSpacing": true,
  "arrowParens": "always"
}

요약

Prettier 설정을 효과적으로 사용하기 위해서는 각 항목의 역할과 옵션을 잘 이해하고 적절하게 설정 파일을 구성하는 것이 중요합니다. 코드 포맷팅의 일관성은 코드의 가독성과 유지보수성에 큰 영향을 미치므로 신중한 설정이 필요합니다.

Prettier 공식 문서에서 더 자세한 내용을 확인할 수 있습니다(Prettier 공식 문서).