STEP | VScode | prettier 설치 후 실행하기

⚙️ STEP | VSCode | prettier 설치 후 실행 방법

VSCode에서 prettier 설치 후 적용이 되지 않을 경우, 설정하는 방법에 대해 알아봅시다.

* prettier 자바스크립트 라이브러리로 작성된 코드를 저장할 시 줄간격 등을 맞춰 표준 스타일에 맞도록 변경시켜 주는 코드 포멧터(Code Formatter)입니다.
또한 구문을 분석해 완전히 재작성해준다는 점에서 다른 포멧터와 차이점이 있습니다.

---

1

우선 Extension에서 Prettier를 설치해줍니다.

2

설정에서 editor format on save 검색하고 체크 표시를 해줍니다.

3

설정에서 json 검색하고 Edit in settings.json을 눌러 파일을 열어줍니다.

VSCode 내 설정값들이 저장되는 파일로 설정을 어떻게 했는지에 따라 다들 다르게 뜨는게 정상입니다 !

4

"editor.formatOnSave"을 찾아 false로 되어 있다면 true로 변경 후 저장합니다.

6

잘 작동하는지 확인해봅니다.

지금까지 했는데도 안된다면 여기를 눌러 진행해주세요 !

7

Edit in settings.json 파일 내 아래 표시된 부분을 추가해줍니다.

8

잘 작동하는지 확인해봅니다.