Webstorm eslint, prettier 설정

이건 할때마다 까먹고 혼란스럽다.
기본이 부족해서 그렇겠지 아무래도.

맥북 고장이슈로 윈도우로 넘어왔다.

멘붕의 하루

 

 

기존맥에 lint 설정을 어떻게 했었는지...
문제 없었는데 자꾸 귀찮게 빨갛게 lint에러가 뜬다.

 

빌드가 안되거나 그런건 아니지만
lint 설정을 올바르게 해놓고
저장할때마다 자동으로 코드 컨벤션이 맞도록 하자.

 

각설하고 아래처럼 해놓으면된다.

1. 설정(Settings) > Tools > File Watchers  에 들어간다.

2. + 버튼 눌러서 Prettier 설정을 추가해준다.

3. 설정 값은 아래와 같다.
Name : 본인이 설정하고 싶은 이름 하면됨.
File type : TypeScript (JavaScript쓰는 사람은 그거하면됨)
Scope : Project Files
Program : $ProjectFileDir$\node_modules\.bin\prettier
Arguments :  --write $FilePath$
Output paths to refresh : $FilePath$
Working directory : $ProjectFileDir$
Environment variables : 공란(빈칸)

아래 이미지를 참조하시길.

 

 

 

 

스페이스 하나 입력하고 컨트롤 +S 눌러서 저장해보면?
이제는 깔끔.

 

 

참고로 현재 되어있는 .prettierrc 파일 설정값

{
  "singleQuote": true,
  "trailingComma": "all",
  "semi": true
}