728x90
반응형
팀 프로젝트를 진행하면서 코드 스타일을 통일하기 위해 .prettierrc 파일을 만들어서 관리했다. 이 과정을 작성해보려고 한다.
설치순서
1. 프로젝트 루트 폴더 위치에서 터미널에 npm i -D prettier eslint-config-prettier 명령어를 입력하여 패키지를 설치한다.
- eslint-config-prettier 패키지는 Prettier와 충돌하는 ESLint 규칙들을 비활성화 시켜준다.
2. 그리고 .prettierrc 파일을 프로젝트 최상단에 만든다.
728x90
3. 원하는 설정을 입력한다.
- 추가적으로 필요한 설정들은 Prettier Options를 참고하면 된다.
// .prettierrc
{
"singleQuote": true,
"printWidth": 100,
"tabWidth": 2,
"trailingComma": "all"
}
- singleQuote (default: false)
- 작은 따옴표 사용 여부
- printWidth (default: 80)
- 한 줄에 최대 몇 글자를 작성할 건지
- tabWidth (default: 2)
- 자동 들여 쓰기 값은 스페이스 2칸이다.
- trailingComma (default: none)
- 객체, 배열, 함수 등 마지막에 쉼표를 찍을지에 대한 여부
4. 설정에서 Format On Save을 검색하고, 이를 체크해준다.
반응형
참고자료
728x90
반응형
'JavaScript' 카테고리의 다른 글
[자바스크립트] filter는 빈 값("", null, undefined)을 자동으로 제거해준다. (0) | 2023.02.08 |
---|---|
[자바스크립트] switch문 (0) | 2023.02.07 |
[자바스크립트-배열] 모든 값을 0으로 가지는 배열 만들기 (0) | 2023.02.03 |
[자바스크립트] 재귀함수와 스택 프레임(Stack Frame) (0) | 2023.02.03 |
Airbnb 컨벤션에 따라 ESLint 설정하기 (0) | 2023.02.02 |
댓글