코드를 분석하여 깔금하고 일관된 코드스타일을 유지시켜주게 도와주는 코드 포맷터이다. 우리는 세이브 자동으로 포맷팅 기능을 쓰고싶다👍 하지만 처음이라면 Prettier세팅이 생각보다 어렵다. 이 글은 세팅에 대해 설명하는 글이다. |
혹시 몰라 설치하는 방법도 적어본다. 필요하다면 아랫줄의 더보기를 클릭하자
더보기
1. 빨간색 박스의 아이콘을 클릭하자
2. 검색창에 prettier를 입력후 검색된 prettier를 설치하자.
나는 이미 설치가 되어있기 때문에 처음 설치하는 경우 화면이 다를 수 있다.
설치가 끝났다면 다음 내용대로 세팅하자.😁
Prettier 설정방법
1. 설정으로 들어가자
2. 검색창에 editor format on save
를 입력 하고
Editor: Format On Save
를 체크해주자.
3. 검색창에 editor Default Formatter
를 입력
Editor: Default Formatter
를 esbenp.prettier-vscode
로 선택하자!
보통은 여기까지 하면 될거라고 생각하지만 잘 작동하지 않는다면, 다음 단계도 따라해보자.😉
4. Prettier를 사용하려는 파일로 이동한다.
(나는 내가 만들어서 놀고 있던 home.html탭을 클릭했다)
그 뒤에 F1
을 누르고 검색창에Format Document
를 입력
문서 서식 프로그램을 선택하자
5. 기본 값으로 Prettier - Code Formatter
선택하면 모든 설정이 끝!
이렇게까지 했는데 작동을 안한다면???
vsc를 껏다가 켜보도록 하자.🙄
댓글