728x90
webstorm에서 prettier 설정하는 법
1. prettier 패키지 추가
일단 패키지를 추가한다. yarn을 사용해서
$ yarn add prettier로 추가했다.
2. config 파일 추가
package.json과 같은 루트에 .prettierrc 파일을 추가한다.
내가 사이드프로젝트에서 주로 사용하는 설정파일은 아래와 같다.
{
"trailingComma": "es5",
"printWidth": 80,
"tabWidth": 2,
"semi": false,
"singleQuote": true,
"jsxSingleQuote": true,
"jsxBracketSameLine": false
}
3. IDE 설정 추가
설정 > preferences 에서 prettier를 검색한다.
사용할 파일들을 설정해주고, 저장할때마다 실행시켜주기 위해 체크체크 해줬다.
패키지를 직접 선택해야하는데 위에서 설치한 node_modules에 있는 prettier 패키지를 직접 선택해준다.
그리고 코드 작성해보고 command + s (저장)을 눌러보면 prettier 설정대로 동작하는 것을 확인할 수 있다.
728x90
'Dev > TIL' 카테고리의 다른 글
| vscode 1분만에 prettier 설정하기 (+ 저장 후 변경 안되는 경우) (1) | 2022.09.05 |
|---|---|
| [Vite] typescript + vite 절대경로 설정하기 (0) | 2022.09.04 |
| [css] 이미지 에러 처리하기, 디폴트 이미지 처리 (0) | 2022.08.27 |
| <br /> 태그를 엔터로 바꾸는 방법 (0) | 2022.04.20 |
| localhost 에서 ssl 설정하기, 호스트(host) 변경하기 (0) | 2022.04.14 |