VScode Prettier

VScode Prettier

안녕하세요 TriplexLab 입니다 :)
오늘은 코드 품질를 좀더 효율적으로 관리하기 위해서 prettier라는 확장 프로그램을 사용해 봅시다.
VS code 에디터에서 prettier를 설치해 주세요.

VS code 에디터에서 prettier의 모습.

그리고 단축키 
command + ,를 눌러서 설정 파일에 들어가주세요.
settings.json 파일로 들어가시면 됩니다.

저는 하단에 있는 옵션들을 추가 했습니다.
옵션들을 공식문서에서 검색해서 무슨 의미인지 보시고, 자신의 프로젝트에 추가 하는것을 추천 합니다. 

참고로 editor.defaultFormatter 같은 경우에는 VScode(에디터) 기본적으로 Formatter기능을 가지고 있습니다. 
뿐만 아니라, Beautify등 Formatter기능을 하는 다른 확장프로그램도 있습니다. 
그래서 우리는 editor.defaultFormatter에 VScode기본 Formatter로 설정을 해준것 입니다.!

"editor.defaultFormatter": "esbenp.prettier-vscode", //vscode에서 사용하기 위한 기본 세팅
"editor.formatOnSave": true,
"prettier.arrowParens": "avoid",
"prettier.tabWidth": 2,
"prettier.semi": false,
"prettier.singleQuote": true,
"prettier.printWidth": 80,
"prettier.trailingComma": "es5",

예시)
"prettier.arrowParens": "avoid" 은 에로우 funtion에 파라미터로 1개밖에 없으면 저장버튼 눌렀을때 가로를 없어주는것 입니다.

에로우 funtion 변경 되는 모습.

저는 한가지 예시를 보여 드렸는데
prettier 공식 문서보시면 더 많은 정보를 보실수 있습니다.

감사합니다 :)