[typescript] Prettier와 JSON 형식 포맷팅하기

이 문서에서는 Prettier 도구를 사용하여 TypeScript 및 JSON 파일을 포맷팅하는 방법에 대해 알아보겠습니다.

Prettier란 무엇인가요?

Prettier는 코드를 더 간결하고 일관된 형식으로 자동으로 포맷팅해주는 도구입니다. 이를 통해 개발자는 코드스타일에 대한 일일이의 고민을 덜 수 있으며, 코드베이스의 일관성을 유지할 수 있습니다.

TypeScript 파일 형식 지정하기

Prettier를 사용하여 TypeScript 파일을 형식 지정하려면 다음 단계를 따를 수 있습니다.

  1. 먼저, 프로젝트 루트 폴더에 .prettierrc 파일을 만듭니다.
  2. 그런 다음 설정을 원하는 대로 .prettierrc 파일에 추가합니다. 예를 들어, 들여쓰기 크기, 세미콜론 사용 여부, 따옴표 스타일 등을 지정할 수 있습니다.

    {
      "semi": false,
      "singleQuote": true
    }
    
  3. 그런 다음 프로젝트에 Prettier를 설치합니다.

    npm install --save-dev prettier
    
  4. 마지막으로 package.json 파일에 스크립트를 추가하여 TypeScript 파일을 자동으로 형식 지정할 수 있습니다.

    {
      "scripts": {
        "format": "prettier --write \"src/**/*.ts\""
      }
    }
    

이제 npm run format 명령을 실행하면 프로젝트 내의 모든 TypeScript 파일이 Prettier를 통해 형식 지정됩니다.

JSON 파일 형식 지정하기

JSON 파일을 Prettier를 사용하여 형식 지정하려면 다음과 같이 진행합니다.

  1. 프로젝트에 Prettier를 설치합니다.

    npm install --save-dev prettier
    
  2. 그런 다음 package.json 파일에 스크립트를 추가하여 JSON 파일을 자동으로 형식 지정할 수 있습니다.

    {
      "scripts": {
        "format:json": "prettier --write \"src/**/*.json\""
      }
    }
    

위의 스크립트를 실행하면 프로젝트 내의 모든 JSON 파일이 Prettier를 통해 형식 지정됩니다.

마무리

이제 Prettier를 사용하여 TypeScript 및 JSON 파일을 간편하게 형식 지정할 수 있게 되었습니다. 이를 통해 코드의 가독성을 높이고 일관성을 유지할 수 있습니다.

더 자세한 정보는 Prettier 공식 문서를 참조하시기 바랍니다.