prettier 사용하기 (vscode)

• VScode에서 prettier를 적용하고자 한다면, 확장도구 Prettier - Code formatter를 설치한다.

https://marketplace.visualstudio.com/items?itemName=esbenp.prettier-vscode 

Prettier - Code formatter - Visual Studio Marketplace

• 또한, 파일을 저장할 떄 자동으로 prettier를 적용하기 위해서 VScode에서 F1을 누르고 settings.json 파일을 찾아 연다.
• 다음과 같이 수정하면 저장시 자동으로 코드가 정렬된다.

{
  ...,
  "editor.formatOnSave": true,
  "editor.defaultFormatter": "esbenp.prettier-vscode",
}

.prettierrc.js

• 프로젝트에서 모든 팀원들이 같은 규칙으로 코드를 작성하고자 한다면, root에 .prettierrc.js 파일을 작성한다.
• 이제 prettier는 이 파일에 적힌 규칙대로 작용할 것이다.

module.exports = {
  arrowParens: 'avoid',
  bracketSameLine: true,
  bracketSpacing: false,
  singleQuote: true,
  trailingComma: 'all',
  semi: false,
};