[Visual Code / VS Code] prettier 자바스크립트 자동 포맷터 설정

스크립트 자동정렬할때 사용.

구글 찾아보았는데 설정이 바로 적용이 안됐다.

 

1. vs모듈 추가하는곳에서 prettier을 설치

2. .prettierrc 파일 생성 

{
	"singleQuote": true,
	"semi": true,
	"useTabs": false,
	"tabWidth": 4,
	"trailingComma": "all",
	"printWidth": 80
  }

3. 파일 > 기본설정 > 설정 > 검색에 prettier 입력 후 아래와 같이 설정

4. 파일 > 기본설정 > 설정 > 검색에 format on save입력 후 아래와 같이 설정

 

위에 절차를 거쳤는데 반영이 안됐음..

아래의 출처 사이트를 통해 해결

 

단축키로는 [Alt] + [Shift] + [f] 를 입력하시면 됩니다.
최초 사용시에는 어떤 Formatter를 사용할지 물어볼 수도 있는데 그때 Prettier를 선택해주시면 됩니다.

 

 

 

출처 : thinkground.studio/visual-studio-code-%EC%9C%A0%EC%9A%A9%ED%95%9C-%EA%B8%B0%EB%8A%A5-prettier/

Visual Studio Code 유용한 기능 - prettier | ThinkGround