[vue] eslint 가 아닌 prettier 가 적용 될 때

vs code 에서 별다른 설정을 만지지 않았음에도 불구하고 

내가 원했던 대로 개행이 되지 않았다.

또한 자꾸 스크립트 부분에 작은 따옴표를 사용한다고 설정 해두었는데

저장할때마다 큰 따옴표로 변경되어 불편함을 느꼈다.

 

내가 원한 코드

저장시 자꾸 이렇게 저장됨 ..

검색해보니 설정이 바뀌어있었다.

 

vscode 의 단축키 ctrl + shift + p 로 메뉴 검색을 열어서 Open Settings (JSON) 을 열어준다.

ctrl + f로 formatter 라고 검색해보면 

  "editor.defaultFormatter": "esbenp.prettier-vscode",

이렇게 eslint 가 아닌 prettier 로 설정되어 있음을 알 수 있다.

 

그 부분을 아래와 같이 eslint 로 변경해주면, 성공적으로 원하던 부분에서 개행이 된다.

  "editor.defaultFormatter": "dbaeumer.vscode-eslint",

 

참고로, 아래와 같이 출력 - Prettier 로 설정된 부분에서 singleQuote : false로 설정이 되어있을 때 

이 방법으로 수정 할 수 있다.