반복되는 코드를 한번에 수정하기
- 맥 단축키: Command + D
- 윈도우 단축키: CTRL + D
반복된 코드를 한번에 수정할 때 유용하다. 단축키를 누를 때마다 해당 코드가 반복 선택된다.
아래 화면은 preDocumentInfo 코드를 location으로 변경하고 있다.
변수명/함수명 한번에 바꾸기
- 단축키: F2
함수나 변수명을 한번에 변경할 때 유용하다. 위의 단축키와는 다르게 선택한 변수명을 수정하면 해당 변수명이 모두 변경된다.
코드 위/아래로 이동하기
- 맥 단축키: Option + ↑ 또는 ↓
- 윈도우 단축키: Alt + ↑ 또는 ↓
이동할 코드에 커서를 두고 단축키를 누르면 해당 코드가 위/아래로 이동한다. 여러 줄의 코드를 선택하면 선택된 코드가 모두 이동한다.
코드 위/아래로 복사하기
- 맥 단축키: Shift + Option + ↑ 또는 ↓
- 윈도우 단축키: Shift + ↑ 또는 ↓
위와 다르게 코드를 위/아래로 복사한다. 같은 코드를 복사&붙여넣기 할 때 유용하다.
코드를 한번에 주석 처리하기
- 맥 단축키: Command + /
- 윈도우 단축키: Ctrl+ /
해당 언어 문법에 맞게 자동으로 주석 처리해준다. 단축키를 다시 누르면 주석이 해제된다.
여러 곳에 커서를 두고 수정하기
- 맥 단축키: Option + 마우스 클릭
- 윈도우 단축키: Alt + 마우스 클릭
단축키를 누르고 마우스를 클릭하면, 클릭하는 곳마다 커서가 생성된다.
다중 커서 선택하여 수정하기
- 맥 단축키: Command + Option + ↑ 또는 ↓
- 윈도우 단축키: Ctrl + Alt + ↑ 또는 ↓
수정해야 할 세로 위치가 동일하다면, 다음 단축키를 사용하여 커서를 여러 곳에 두고 수정할 수 있다.
코드 맨 마지막에 커서 두기
- 맥 단축키: Shift + Option + I
- 윈도우 단축키: Shift + Alt + I
이 단축키도 매우 유용하다. 주로 변수를 복사&붙여넣기 한 다음, 끝에 콤마(,)나 세미콜론(😉 을 넣을 때 자주 사용한다.
커서 위치에서 박스 형태로 선택하기
- 맥 단축키: Shift + Option + 마우스 드래그
- 윈도우 단축키: Shift + Alt + 마우스 드래그
코드를 커서 위치에서 박스 형태로 선택할 때 유용하다.
코드 맨 위 또는 맨 아래로 이동하기
- 맥 단축키: Command + ↑ 또는 ↓
- 윈도우: 단축키: Ctrl + Home 또는 End
import를 입력하기 위해 코드 맨 위로 이동하거나, 코드를 추가하기 위해 맨 아래로 이동할 때 유용하다.
사이드바 숨김/보이기
- 맥 단축키: Command + B
- 윈도우 단축키: Ctrl + B
코드 창을 넓게 보고 싶을 때 사용한다.
단축키 모두 확인하기
맥 기준으로 설명하겠습니다.
단축키를 볼 수 있는 페이지는 메뉴 Code > Preferences > Keyboard Shortcuts에 있다. Shift + Command + P 를 눌러서 keyboard shortcuts를 검색하면 쉽게 찾을 수 있다. 또는 단축키로 Command + S, Command + K 를 차례대로 입력하면 단축키 페이지로 이동한다.
이곳에서 모든 단축키를 볼 수 있다.
출처 : anpigon.github.io/2019/11/11/vscode-keyboard-shortcuts/
터미널탭 켜기
ctrl + shift + back quote( 영어로 바꾼후 ~표시)
작업중인 창 prev, next
option + command + left
option + command + right
같은 단어를 여럿 선택해서 일괄 변경하기
바꿀 단어를 드래그한후 cmd + d 연발 하면 같은 단어를 찾아준다. 그리고 새로운 스펠을 써주면 일괄적으로 변경 됌.
에디터 탭 이동
ctrl + tab
에디터 창 분할
ctrl + command + right
에디터 창 합치기
ctrl + command + left
다중 커서 셀렉션
option + command + up
option + command + down
컬럼(박스) 셀렉션
커서를 원하는 곳에 위치 시켜 놓고 shift + alt를 누른채로 드래깅을 하면 박스 형태로 셀렉션이 된다.
복사하려는 코드라인에 커서두고 셀렉션 위/아래로 복사
option + shift + up
option + shift + down
이동하려는 코드라인에 커서두고 셀렉션 위/아래 이동
option + up
option + down
출처: 오역 유발자 의 VSCode to the rescue
현재 행 위 아래로 복사 및 추가하기
복사할 행에 커서를 올립니다.
shift+alt+Down 위에 행 복사 추가
shift+alt+Up 아래에 행 복사 추가
다중 커서 셀렉션
opt+cmd+up 또는 opt+cmd+down
split right 단축키
에디터창에서 cmd + \
split down
피벗 모니터를 쓰신다면~
cmd + \
open Preference > OPEN.SETTING (JSON )
"workbench.editor.openSideBySideDirection": "down" // split down 추가
vscode 쓰면서 같은 프로젝트를 여러 window로 보고싶을땐
에디터 켠 상태에서 cmd + shift + p dupl
이렇게 나옴 요거 선택해주면 같은 프로젝트를 복제한 window를 두개 이상 띄울 수 있어요.
.editorconfig
프로젝트 또는 코드베이스에 EditorConfig 파일을 추가하여 코드베이스에서 작업하는 모든 사람들의 코딩 스타일을 일관적으로 유지할 수 있습니다. EditorConfig 설정은 전역 Visual Studio 텍스트 편집기 설정에 우선합니다
https://docs.microsoft.com/ko-kr/visualstudio/ide/create-portable-custom-editor-options?view=vs-2019
그러면 editorconfig에서 쓰이는 속성은 어떻게 암?
https://github.com/editorconfig/editorconfig/wiki/EditorConfig-Properties
snippet
console.log를
log tab으로 줄이고 싶어용.
명령파레트 열기 cmd + shift + p
>user snippet
javascript 단축키를 만들거니
selectBox에서 javascript.json을 편집합니다.
javascript.json에 가보면
이미 주석처리가 되어있는 스니펫이 있음 주석을 풀어주거나 아랜 내용을 추가
"Print to console": { "prefix": "log", "body": [ "console.log('$1');", "$2" ], "description": "Log output to console" }