[VSCode] prettier 기본설정

VSCode에서 prettierrc 기본설정을 해보자 !

 

1. VSCode extensions > Prettier - Code formatter 다운로드

 

 

2. 최상단에 .prettierrc 파일 추가

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

저는 요로코롬만 세팅해주었는데요.

위에서부터

single 쿼트 사용 ->  " X / ' O

세미콜론 사용 ->  ; 자동생성

useTabs 탭 사용여부 -> 요건 false나 true나 똑같이 탭사용이 가능해서 왜 하는지 모르겠..

tabWidth 탭 너비 -> 요건 2로하면 너무 좁아 보여서 4나 6으로 주로 해주는 편

trailingComma 여러줄을 사용할때 후행 콤마 사용방식 이라고 하는데 그냥 all로 해줌

printWidth : 120 요건 코드가 옆으로 길어지면 자동으로 내려주는 길이를 정하는건데 너무 짧게해놓으면

긴 코드같은것들이 너무 밑으로 길어져서 저는 100 ~ 200사이로 맞춰주는 편!

 

나머지는 설정들은 많지만 저는 이렇게만 세팅하는편입니다!

 

 

팁!

* 깃에 prettier 설정 파일을 추가하고 싶지 않으면?

gitignore 에 .prettierrc 추가

 

* 저장할때 자동으로 코드 포맷 설정되게 변경하고 싶으면?

1. command + , 눌러서 세팅으로 들어가준다.

2. format on save 라고 검색

3. 요로코롬 맨위에 체크박스 클릭해주면 저장시 자동으로 변경!

 

 

다들 각자 자기 기준에 맞게 이쁜 포맷 설정하세요 ~ !