[VSCode] 당신의 생산성을 높여 줄(지도 모르는) 단축키 모음

우재윤·2023년 5월 12일

2023.05.12 최신 버전, Mac OS를 기준으로 합니다!
윈도우도 대부분 있으니 첨부해둔 [단축키 이름]으로 단축키 검색하면 나올 거에요(단축키 모음을 볼 수 있는 단축키 → ⌘(cmd) + K ⌘(cmd) + S)

⌘ - command(cmd)
⌥ - option(opt)
⌃ - control(ctrl)
⇧ - shift

VSCode

검색, 이름 바꾸기

[찾기] ⌘(cmd) + F → 파일 내 검색(이건 너무 유명 하죠?)

[바꾸기] ⌘(cmd) + ⌥(opt) + F → 찾은 이름을 한꺼번에 변경하고 싶을 때(Enter로 하나씩 넘겨가며 바꿀 수 있어요)

[검색: 파일에서 찾기] ⌘(cmd) + ⇧(shift) + F → 파일이 아니라 현재 열려있는 프로젝트 전체를 검색하고 싶다구요?

[검색: 파일에서 바꾸기] ⌘(cmd) + ⇧(shift) + H → ⌘(cmd) + ⌥(opt) + F 의 전체 검색 버전

[기호 이름 바꾸기] F2 → 참조 하고 있는 모든 이름 바꾸기.
하단의 Home 클래스를 사용하고 있는 모든 곳의 이름을 바꿔줍니다(제일 유용함)

[정의로 이동] F12 → 모든 참조 보기 (가장 많이 쓰는 단축키 1)
한번도 안 써본 사람은 있어도 한번만 쓴 사람은 없는 단축키. 이러저러한 설명보다 직접 사용해보는게 빨라요. 지금 바로 아무 변수나 함수에 사용해보세요. package manager를 통해 설치한 라이브러리를 사용할 때도 해당 package 파일로 찾아가 줍니다.

[파일로 이동] ⌘(cmd) + P → 파일명 검색, 열기 (가장 많이 쓰는 단축키 2)
파일명을 입력하면 찾아주고 방향키로 선택하고 Enter를 누르면 열어줍니다. 열려 있으면 해당 편집기로 포커스 이동

[작업 영역에서 기호로 이동] ⌘(cmd) + T → 변수, 클래스 명 검색, 이동
파일명 검색의 변수, 클래스 검색 버전. 눈치 채셨을지 모르겠지만 ⌘(cmd) + P 에서 #을 입력하면 동일한 동작을 합니다.

[포커스 및 이동 경로 선택] ⌘(cmd) + ⇧(shift) + . → 파일 내의 변수, 클래스, 메소드 등을 찾기. 위아래 화살표로 선택해서 Enter를 누르면 해당 변수로 이동. 스코프 단위로 나뉘는 것 같습니다.

[이동 경로에 포커스] ⌘(cmd) + ⇧(shift) + ; → 단축키로 빠르게 파일, 스코프 등을 이동

파일 편집기

[보기: 이전 편집기 열기, 보기: 다음 편집기 열기] ⌘(cmd) + ⌥(opt) + 좌우 화살표 → 좌우 편집기 이동

[보기: N 번째 편집기 그룹에 포커스] ⌘(cmd) + 숫자 → 해당 번호의 분할 창으로 포커스 이동, 없다면 새로운 분할 창 열기. 편집기가 아닌 분할 창을 이동합니다. 또한 편집기가 하나라면 ⌘(cmd) + 1, 2 만 가능, 두 개면 1, 2, 3 만... 등등

[보기: 편집기 분할] ⌘(cmd) + \ → 파일 분할 보기. 보고 있는 파일을 새로운 분할 창으로 복제

[보기: 편집기를 이전 그룹으로 이동, 보기: 편집기를 다음 그룽으로 이동] ⌘(cmd) + ⌃(ctrl) + 좌우 화살표 → 현재 보고 있는 편집기를 분할 창 좌우로 이동

커서 이동 관련

[cursorColumnSelect] ⇧(shift) + 화살표 → 선택한 채로 이동. 후술할 다양한 커서 이동 관련 단축키와의 조합으로 활용법이 무궁무진한 단축키에요.

[cursorWordLeft, cursorWordRight] ⌥(opt) + 좌우 화살표 → 단어 단위로 커서 이동

[cursorTop, cursorLeft...] ⌘(cmd) + 화살표 → 좌우상하 끝으로 이동

[대괄호로 이동] ⌘(cmd) + ⇧(shift) + \ → 브래킷의 양 끝으로 이동. 브래킷이 길어졌을 때 끝이 어디지? 혹은 시작이 어디지? 할 때 이동시켜주는 단축키

[위에 커서 추가, 아래에 커서 추가] ⌘(cmd) + ⌥(opt) + 위아래 화살표 → 위아래 멀티 커서 추가. 여러 줄의 내용을 한 번에 수정하고 싶을 때 커서를 여러 개 추가 할 수 있어요. 위에 나온 ⌥(opt) + 좌우 화살표, ⇧(shift) + 화살표 등을 같이 활용해 주면 더 좋겠죠?

⌥(opt) + 마우스 좌클릭 → 멀티 커서 추가(마우스). 멀티 커서 추가 마우스 버전으로 ⌘(cmd) + ⌥(opt) + 위아래 화살표가 인접한 위, 아래 줄만 이동 가능하던 제한사항 없이 원하는 곳에 멀티 커서를 추가할 수 있어요.

[돌아가기, 앞으로 이동] ⌃(ctrl) + -, ⌃(ctrl) + ⇧(shift) + - → 이전 커서 위치로, 다음 커서 위치로 (가장 많이 쓰는 단축키 3)

편집 관련

[아래에 줄 삽입] ⌘(cmd) + Enter → 아래에 줄 추가. 일반 Enter와의 차이점은 커서 위치 상관 없이 아래에 추가

[줄 주석 설정/해제] ⌘(cmd) + / → 선택된 줄 주석 처리. ⇧(shift) + 화살표와 함께 사용하면 여러 줄을 한 번에 주석 처리 할 수 있어요.

[제안 항목 트리거] ⌘(cmd) + I → 자동완성 도구 열기. 코드를 작성하다 보면 VSCode에서 자동완성 도구를 추천 해주는데 편집을 하다보면 필요한데 안뜨거나 사라지는 경우가 있죠? 그때 한 글자 지우고 다시 쓰고 해도 되지만 요걸 써주면 됩니다.

[줄 위로 이동, 줄 아래로 이동] ⌥(opt) + 위아래 화살표 → 커서가 위치한 줄을 위아래로 한 줄씩 이동. ⇧(shift) + 화살표로 여러 줄을 선택하면 다같이 잡고 움직일 수 있어요

[위에 줄 복사, 아래에 줄 복사] ⌥(opt) + ⇧(shift) + 위아래 화살표 → 커서가 위치한 줄을 위아래로 복사, 붙여넣기. 복사할 부분 선택하고.. 복사하고.. 엔터쳐서 붙여넣기..를 하고 계시면 제 속이 터져요. 얘도 여러 줄 가능.

기타

[보기: 기본 사이드 바 가시성 전환] ⌘(cmd) + B → 좌측 사이드 바(파일, 검색, 디버그 도구 등등 있는 곳) 열기, 닫기

[보기: 패널 표시 설정/해제] ⌘(cmd) + J → 패널(터미널, 디버그 콘솔 등등 있는 곳) 열기, 닫기

⌃(ctrl) + ` → 터미널 열기, 패널이 열려있을 때만 열리거나 잘 안먹히는 경우가 많음

[새창] ⌘(cmd) + ⇧(shift) + N → 새로운 VSCode 창 열기

[문서 서식] ⌥(opt) + ⇧(shift) + F → 코드 포맷팅(정렬), 저장 X (가장 많이 쓰는 단축키 4) ⌘(cmd) + S 로 저장해도 코드 포맷팅이 되지만 핫 리로드를 지원하는 개발 환경이라면 빌드가 새로 고침 돼서 불편하기도 하고, 코드가 길어지는 경우 쓰다가 중간중간 정렬해서 정리하면서 작성할 수 있어서 유용.