본문 바로가기
JavaScript 시리즈☕

🚀 VSCODE 들여쓰기 설정방법 🚀 | JavaScript 시리즈 001

by @ENFJ 2021. 7. 28.

 


참고하기

코드 에디터는 코드를 쉽게 작성할 수 있게 자동화된 기능들이 있습니다. 그래서 만약 자동화된 기능이 우리가 지키려고 하는 스타일 가이드와 일치하지 않는다면 에디터에서 몇 가지 설정을 바꿔주어야 하는데요. 코드 에디터마다 다르겠지만 일반적으로 들여쓰기(indentation) 부분은 신경을 써야 하는 경우가 많습니다.

여러 자바스크립트 스타일 가이드를 살펴보면 대부분 공통적으로 들여쓰기를 space 2칸으로 사용하도록 권장하는 데요. 이 레슨에서는 vscode 에서 간단하게 indentation을 설정하는 방법을 알려드리겠습니다.

먼저 VSCode를 실행하고, 설정창(Settings)을 열어주세요. 단축키 Ctrl + , (맥에서는 Cmd + ,)입니다.

Step1: 상단의 검색창에서 editor tab이라고 검색한 다음. Step2: Editor: Detect Indentation 은 체크 해제해 주세요. Step3: Editor: Tab Size 는 2로 변경해 주세요. Step4: 기본 값이라 변경할 필요는 없지만 Editor: Insert Spaces 부분이 체크 되어 있는지만 한 번 확인해주세요.

이렇게 되면 들여쓰기 관련된 설정은 모두 완료됬습니다! 간단하죠? :) 그런데 기존에 작성한 코드에는 바로 반영이 되지 않을 텐데요.

기존에 작성했던 파일로 돌아가서 단축키 Ctrl + a (맥에서는 Cmd + a)로 전체선택 해주시고 마우스 오른쪽 클릭으로 나타나는 메뉴에서 Fomat Document을 클릭해 주세요. 단축키는 Shift + Alt + F (맥에서는 Shift + Option + F)입니다.

이제 띄어쓰기 4칸이었던 들여쓰기가 2칸으로 잘 바뀌었나요? 이 설정값을 유지한다면 앞으로 기본 들여쓰기 간격은 띄어쓰기 2칸을 기본으로 사용하게 됩니다.