[Prettier] 자동 수정 적용 안되는 오류 해결

Prettier 를 설치해서 잘 쓰고 있다가 갑자기 적용이 안되길래.. 굉장히 불편해졌다

해결하기 위해 구글링을 열심히 했는데 그 중에서 성공한 방법을 기록하려 한다

 

1. .prettierrc 파일 만들기

 

- 반드시 최상위(root) 폴더에 만들어야 한다

- 해당 파일 안에 들어갈 내용은 아래와 같다

- 불필요한 부분은 삭제해도 무방하다

 

{
    "singleQuote": true,
    "printWidth": 100,
    "tabWidth": 2,
    "useTabs": false,
    "semi": true,
    "quoteProps": "as-needed",
    "jsxSingleQuote": false,
    "trailingComma": "es5",
    "arrowParens": "always",
    "endOfLine": "lf",
    "bracketSpacing": true,
    "jsxBracketSameLine": false,
    "requirePragma": false,
    "insertPragma": false,
    "proseWrap": "preserve",
    "vueIndentScriptAndStyle": false
  }

 

 

 

2. 설정 - default formatter

 

- vsc 하단 왼쪽에 있는 톱니바퀴 모양 클릭하여 설정으로 들어가기

- 검색창에 default formatter 입력

 

 

 

3. Editor: Default Formatter - Prettier 설정

 

- 내 경우에는 Default Formatter 설정이 none 으로 되어 있었다

- 이 설정을 Prettier - Code formatter 로 바꿔주니 적용이 잘 되었다

 

 

 

 

 

---

TIL 끝!