본문 바로가기
Develope_Computer_Science

VS code 단축키 정리

by 스타트업_디벨로퍼 2021. 2. 10.

반복되는 코드를 한번에 수정하기

  • 맥 단축키: 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/

 

VSCode 단축키 5분 정리

아래 유튜브를 보고 VSCode에서 유용한 단축키를 정리해 보았습니다. 반복되는 코드를 한번에 수정하기 맥 단축키: Command + D 윈도우 단축키: CTRL + D 반복된 코드를 한번에 수정할 때 유용하다. 단

anpigon.github.io

터미널탭 켜기

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" }

velog.io/@noyo0123/vscode-%EB%8B%A8%EC%B6%95%ED%82%A4-

반응형