[javascript] Prettier를 어떻게 설치하고 설정하는가?

Prettier는 코드 서식을 일관되게 유지하는 데 도움이 되는 도구입니다. 코드 서식을 지정하는 데 대부분의 경우 합의가 필요하지 않으며, 각 개발자가 스타일을 일일이 따르도록 강제할 필요가 없습니다. Prettier는 코드를 자동으로 서식을 지정하여 작성한 다음 코드를 편집할 때 다시 서식을 지정하지 않도록 합니다.

설치 및 설정

  1. Prettier를 설치합니다.

프로젝트 디렉토리에서 다음 명령을 실행하여 Prettier를 설치합니다:

npm install --save-dev --save-exact prettier
  1. Prettier 구성 파일을 생성합니다.

프로젝트 루트에 .prettierrc 또는 prettier.config.js 파일을 만들어 Prettier 구성을 정의합니다. 이 파일에서 코드 서식 옵션을 구성할 수 있습니다. 예를 들어 .prettierrc 파일을 사용하여 일부 옵션을 구성하는 방법은 다음과 같습니다:

{
  "semi": false,
  "singleQuote": true
}
  1. Prettier를 사용하여 코드를 서식 지정합니다.

Prettier를 사용하여 프로젝트의 모든 JavaScript 파일을 서식 지정하려면 다음 명령을 실행하세요:

npx prettier --write "src/**/*.js"

이렇게 하면 Prettier가 프로젝트의 모든 JavaScript 파일의 서식을 일관되게 지정합니다.

Prettier와 함께 사용되는 인테그레이션

대부분의 코드 편집기 및 IDE에서는 Prettier 플러그인 또는 확장 프로그램을 통해 코드를 서식 지정할 수 있습니다. 예를 들어 Visual Studio Code에서 Prettier 확장 프로그램을 설치하여 코드를 서식 지정할 수 있습니다.

이제 Prettier를 설치하고 구성하여 코드 서식을 일관되게 유지하는 방법에 대해 알아보았습니다. 코드 서식을 일치시키면 코드를 읽고 유지 보수하기가 훨씬 쉬워집니다.