반응형
EditorConfig
일관된 코드의 작성 형태를 맞추기 위해 보통 사용된다. eslint(문법 검사), prettier(코드 포맷) 와 같이 비교 되고는 한다.
다만 현 회사에서 이미 EditorConfig이 존재하기 때문에 이번에 알아보기로 했다.
Extension 설치
EditorConfig는 eslint,prettier와 달리 npm으로 설치 할 필요는 없다. 다만 Vscode 같은 경우 Extensions에 추가 설치가 필요하다.
🥼 Editorconfig 작성
EditorConfig는 어떻게 코드를 포맷 할것인가에 대해서 작성하는 곳이다. 예를 들어 들여쓰기 기준을 tab으로 잡을지 space 으로 잡을지 결정을 한다. 그리하는 나는 아래 처럼 작성하였다.
root = true
[*] # 모든 파일에 적용 특정파일에 적용도 가능하다.
indent_style = space # 들여쓰기 설정(space)
indent_size = 4 # 들여쓰기 사이즈
trim_trailing_whitespace = true # newline 앞의 공백 문자를 제거하려면
insert_final_newline = true # insert_final_newline
end_of_line = lf #개행 표시 방법 제어
🌚 설정 후기
현재 EditorConfig에서 max_line_length은 넣어도 적용되지 않았다.. 이유는 아직까지는 찾지를 못했다. 보통 라인이 넘어가면 자동 으로 개행처리하는게 필요한 부분이긴한데, vscode에서 동작을 하지 않는건지는 계속해서 알아볼 필요가 있다.
📡 auto fix 하기
vscode에서는 자동 저장시 적용이 되어야 하기 때문에 "settings.json"에서 아래같이 해줘야 동작하는 것으로 보인다.
{
//settings.json
"editor.codeActionsOnSave": {
"source.fixAll": true
},
"editor.detectIndentation": false,
"editor.formatOnPaste": true,
"editor.formatOnSave": true,
}
반응형
'Vue' 카테고리의 다른 글
🏰 vue2 jest 환경세팅 (0) | 2023.08.09 |
---|---|
props으로 함수 받기 (0) | 2023.07.23 |
Vue + jest + typescript 세팅 (0) | 2023.05.01 |
🎲 vue + jest를 이용한 login 구현 (0) | 2023.04.11 |
🖖 vue jest router 생긴 문제 (0) | 2023.03.16 |
댓글