How can I use Prettier in VScode? / VScode에서 Prettier 자동 정렬하기, 자동 정렬에 대한 환경설정하기

안녕하세요? 요새 react를 vscode에서 개발하고 있습니다.

그런데 예전에 vue를 intelliJ에서 개발할 때에는 eslint라는 것이 있어서...

​

1) 특정 단축키를 눌렀을 때에 문법 교정

2) 저장을 할 때 문법 교정

3) 실시간으로 교정

​

eslint에서 지정한 틀에 위반되는 짓을 하거나, 오타가 나거나 하는 경우 교정을 해주었죠 1,2,3 번 중에 해당하는 방법으로요. 하지만 React에서는 Prettier라는 놈을 쓰더라고요? intelliJ를 쓰시던 분들은 Eslint와 비슷한 역할을 하는 놈이라고 알아주셨으면 좋겠습니다.

​

1. Prettier 플러그인을 설치합니다.

​

2. Prettier 설정

(1) Ctrl + ,를 누르거나 좌측 상단의 File > Preferences > Setting 클릭

​

(2) Setting의 검색창에 default formatter 검색

(되어있으시면 손 안 대셔도 됩니다.)

​

(3) Setting의 검색창에 Format On Save 항목에 체크해 줍니다.

​

​

​

도움받았던 링크 첨부해놓을게요.

감사합니다.

​

https://velog.io/@sdc337dc/TIP-React-%EC%BD%94%EB%93%9C-%EC%9E%90%EB%8F%99-%EC%A0%95%EB%A0%AC%ED%95%98%EA%B8%B0

 

https://jinsiri.tistory.com/543