Visual Studio Code Indent 4 to 2 Setting (VSCode 들여쓰기 설정)

Visual Studio Code Indent 4 to 2 Setting (VSCode 들여쓰기 설정)

 

Visual Studio Code 에서 들여쓰기 설정하는 방법을 알려드리도록 하겠습니다.

 

VSCode의 아래에 보시면 위와같이 보통 Spaces가 4로 설정되어 있으실 겁니다.

코드에도 들여쓰기가 스페이스바 4칸으로 띄워져 있는 것을 보실 수 있습니다.

Spaces를 2로 변경하여 들여쓰기를 2칸으로 설정해보도록 하겠습니다.

 

Mac을 기준으로 VSCode에서 상단 메뉴에서 Code > Preferences > Settings,
혹은 키보드에서 ⌘(Command) + , 로 설정에 들어갑니다.

Window를 사용하시는 분들도 방식은 다를 수 있겠지만 VSCode 설정으로 들어가주시면 되겠습니다.

 

VSCode Settings 로 들어오셨으면, "editor tab" 이라고 검색하면 설정을 해줘야할 세가지 부분을 쉽게 찾으실 수 있습니다.

그럼 이제 필요한 설정을 하도록 하겠습니다.

1. Editor: Detect Indentation 부분에 체크 해제를 합니다.
2. Editor: Insert Spaces 부분은 체크 해줍니다.
3. Editor: Tab Size 에는 원하는 들여쓰기 사이즈를 입력합니다. 2로 설정하시길 추천드립니다.

Editor: Detect Indentation 는 들여쓰기 사이즈가 파일을 열었을 때 기존에 설정되어있는 들여쓰기를 기반으로 자동 설정해줄지 설정하는 부분입니다. 원하는 들여쓰기 사이즈로 고정시켜주기 위해서 체크를 해제합니다.

Editor: Insert Spaces 는 Tab으로 들여쓰기를 하도록 설정하는 부분인데, 아마 기본적으로 체크되어 있으실 겁니다.

Editor: Tab Size 는 들여쓰기 사이즈를 설정해주는 부분입니다. 2를 추천드립니다.

다시 편집하던 파일로 돌아오시면 아래에 Spaces 가 4에서 2로 변경된 것을 확인하실 수 있습니다.

코드에도 들여쓰기 표시 줄이 4사이즈에서 2사이즈로 된 것을 확인하실 수 있습니다.

 

기존에 4사이즈로 들여쓰기 되어있는 코드를 변경된 사이즈로 맞춰줘야겠죠?

코드가 보이는 상태에서 마우스 우클릭을 하면 나오는 메뉴에서 Format Document 를 클릭하시거나,

Mac에서는 키보드에서 ⌥(Option) + ⇧(Shift) + F 를 입력합니다.

 

그럼 위와 같이 변경된 Tab 사이즈로 코드가 자동으로 맞춰집니다!

 

 

제 글에 잘못된 정보, 더 좋은 방법 혹은 정보, 

궁금하신 점, 요청 사항 등이 있으시다면 언제든지 말씀해 주세요!

 

감사합니다.