코드 탐색

Visual Studio Code는 높은 생산성을 제공하는 코드 편집기로, 프로그래밍 언어 서비스와 결합하면 IDE의 강력한 기능과 텍스트 편집기의 속도를 모두 경험할 수 있습니다. 이 섹션에서는 먼저 VS Code의 언어 지능 기능(제안, 매개변수 힌트, 스마트 코드 탐색)을 설명하고, 그 다음 핵심 텍스트 편집기의 강력한 기능을 보여드리겠습니다.

빠른 파일 탐색

팁: ⌘P (Windows, Linux Ctrl+P) (빠른 열기)를 입력하여 이름으로 파일을 열 수 있습니다.

탐색기는 프로젝트를 탐색할 때 파일 간을 이동하는 데 유용합니다. 하지만 작업을 수행할 때는 동일한 파일 세트를 빠르게 오가게 될 것입니다. VS Code는 사용하기 쉬운 키보드 단축키를 통해 파일 내외부에서 이동할 수 있는 두 가지 강력한 명령을 제공합니다.

Ctrl을 누른 상태에서 Tab을 누르면 편집기 그룹에 열려 있는 모든 파일 목록이 표시됩니다. 이 파일 중 하나를 열려면 Tab을 다시 눌 원하는 파일을 선택한 다음, Ctrl에서 손을 떼면 열립니다.

또는 ⌃- (Windows Alt+Left, Linux Ctrl+Alt+-) 및 ⌃⇧- (Windows Alt+Right, Linux Ctrl+Shift+-)을 사용하여 파일 및 편집 위치 간을 이동할 수 있습니다. 동일한 파일의 다른 줄을 계속 전환하는 경우 이 단축키를 사용하여 해당 위치 간을 쉽게 이동할 수 있습니다.

브레드크럼

편집기에는 콘텐츠 위에 브레드크럼(Breadcrumbs)이라는 탐색 막대가 있습니다. 현재 위치를 표시하고 폴더, 파일 및 기호 간에 빠르게 이동할 수 있도록 합니다.

브레드크럼은 항상 파일 경로를 표시하고, 언어 확장의 도움을 받아 커서 위치까지의 기호 경로를 표시합니다. 표시되는 기호는 개요 보기 및 기호 이동의 기호와 동일합니다.

경로의 브레드크럼을 선택하면 해당 수준의 형제 항목이 포함된 드롭다운이 표시되어 다른 폴더 및 파일로 빠르게 이동할 수 있습니다.

현재 파일 형식에 기호에 대한 언어 지원이 있는 경우 현재 기호 경로와 동일한 수준 또는 그 이하의 다른 기호 드롭다운이 표시됩니다.

보기 > 브레드크럼 표시 토글을 사용하거나 breadcrumbs.enabled 설정으로 브레드크럼을 끌 수 있습니다.

브레드크럼 사용자 지정

브레드크럼의 모양은 사용자 지정할 수 있습니다. 경로가 매우 길거나 파일 경로 또는 기호 경로만 관심 있는 경우 breadcrumbs.filePath 및 breadcrumbs.symbolPath 설정을 사용할 수 있습니다. 두 설정 모두 on, off, last를 지원하며 경로의 일부를 표시할지 여부를 정의합니다. 기본적으로 브레드크럼은 브레드크럼 왼쪽에 파일 및 기호 아이콘을 표시하지만, breadcrumbs.icons를 false로 설정하여 아이콘을 제거할 수 있습니다.

브레드크럼의 기호 순서

breadcrumbs.symbolSortOrder 설정을 사용하여 브레드크럼 드롭다운에서 기호의 순서를 제어할 수 있습니다.

허용되는 값은 다음과 같습니다.

• position - 파일에서의 위치(기본값)
• name - 알파벳 순서
• type - 기호 유형 순서

브레드크럼 키보드 탐색

브레드크럼과 상호 작용하려면 브레드크럼 포커스 명령을 사용하거나 ⇧⌘. (Windows, Linux Ctrl+Shift+.)를 누르세요. 마지막 요소를 선택하고 형제 파일 또는 기호로 이동할 수 있는 드롭다운을 엽니다. 현재 요소 앞 또는 뒤의 요소로 이동하려면 ← (Windows, Linux Left) 및 → (Windows, Linux Right) 키보드 단축키를 사용하세요. 드롭다운이 나타나면 입력을 시작하면 일치하는 모든 요소가 강조 표시되고 최적의 일치가 빠른 탐색을 위해 선택됩니다.

드롭다운 없이도 브레드크럼과 상호 작용할 수 있습니다. ⇧⌘; (Windows, Linux Ctrl+Shift+;)를 눌 마지막 요소를 포커스하고, ← (Windows, Linux Left) 및 → (Windows, Linux Right)를 사용하여 이동하고, Space를 눌 편집기에서 요소를 표시할 수 있습니다.

정의로 이동

언어가 지원하는 경우, F12를 눌 기호의 정의로 이동할 수 있습니다.

Ctrl을 누른 상태에서 기호를 마우스로 가져가면 선언 미리 보기가 나타납니다.

팁: Ctrl+Click으로 정의로 바로 이동하거나 Ctrl+Alt+Click으로 정의를 옆에 열 수 있습니다.

정의로 이동

일부 언어는 편집기 컨텍스트 메뉴 또는 명령 팔레트에서 정의로 이동 명령을 실행하여 기호의 유형 정의로 이동하는 것도 지원합니다. 이렇게 하면 기호 유형의 정의로 이동합니다. editor.action.goToTypeDefinition 명령은 기본적으로 키보드 단축키에 바인딩되어 있지 않지만 사용자 지정 키 바인딩을 추가할 수 있습니다.

구현으로 이동

언어는 ⌘F12 (Windows, Linux Ctrl+F12)를 눌 기호의 구현으로 이동하는 것도 지원할 수 있습니다. 인터페이스의 경우, 해당 인터페이스를 구현하는 모든 항목을 보여주고 추상 메서드의 경우, 해당 메서드의 모든 구체적인 구현을 보여줍니다.

기호로 이동

⇧⌘O (Windows, Linux Ctrl+Shift+O)를 사용하여 파일 내에서 기호를 탐색할 수 있습니다. :를 입력하면 기호가 범주별로 그룹화됩니다. Up 또는 Down을 누르고 원하는 위치로 이동하세요.

이름으로 기호 열기

일부 언어는 ⌘T (Windows, Linux Ctrl+T)를 사용하여 파일 간 기호로 이동하는 것을 지원합니다. 어떤 파일에 있든 이동하려는 유형의 첫 글자를 입력하고 Enter를 누르세요.

피크

단순히 무언가를 빠르게 확인하려는데 큰 컨텍스트 전환이 발생하는 것보다 더 나쁜 것은 없다고 생각합니다. 그렇기 때문에 피킹 에디터(peeked editors)를 지원합니다. **참조로 이동** 검색(⇧F12 (Windows, Linux Shift+F12)) 또는 **정의 피킹**(⌥F12 (Windows Alt+F12, Linux Ctrl+Shift+F10))을 실행하면 결과를 인라인으로 포함합니다.

피킹 에디터에서 다른 참조 간을 이동하고 거기서 직접 빠르게 편집할 수 있습니다. 피킹 에디터 파일 이름을 클릭하거나 결과 목록에서 더블 클릭하면 외부 편집기에서 참조가 열립니다.

팁: 추가적으로, Escape를 누르거나 피킹 에디터 영역을 더블 클릭하면 피킹 창이 닫힙니다. 이 동작은 editor.stablePeek 설정으로 비활성화할 수 있습니다.

괄호 일치

커서가 근처에 있으면 일치하는 괄호가 강조 표시됩니다.

팁: ⇧⌘\ (Windows, Linux Ctrl+Shift+\)로 일치하는 괄호로 이동할 수 있습니다.

괄호 쌍 색상 지정

editor.bracketPairColorization.enabled을 true로 설정하면 일치하는 괄호 쌍에 색상을 지정할 수도 있습니다.

모든 색상은 테마에 따라 다르며 최대 6개의 색상을 구성할 수 있습니다.

설정에서 이러한 테마 제공 색상을 재정의하려면 workbench.colorCustomizations을 사용할 수 있습니다.

"workbench.colorCustomizations": {
    "editorBracketHighlight.foreground1": "#FFD700",
    "editorBracketHighlight.foreground2": "#DA70D6",
    "editorBracketHighlight.foreground3": "#179fff",
},

참조 정보

C#과 같은 일부 언어는 인라인 참조 정보를 지원하며, 이는 실시간으로 업데이트됩니다. 이를 통해 편집의 영향을 빠르게 분석하거나 프로젝트 전체에서 특정 메서드 또는 속성의 인기도를 파악할 수 있습니다.

팁: 이러한 주석을 클릭하여 **참조 피킹** 액션을 직접 호출합니다.

팁: CodeLens에 표시되는 참조 정보는 editor.codeLens 설정을 통해 켜거나 끌 수 있습니다.

기호 이름 바꾸기

일부 언어는 파일 간에 기호를 이름 바꾸는 것을 지원합니다. F2를 누른 다음 원하는 새 이름을 입력하고 Enter를 누르세요. 기호의 모든 사용이 파일 전체에서 이름이 변경됩니다.

오류 및 경고

오류 또는 경고는 구성된 작업, 풍부한 언어 서비스 또는 백그라운드에서 코드를 지속적으로 분석하는 린터를 통해 생성될 수 있습니다. 버그 없는 코드를 선호하기 때문에 경고와 오류는 여러 곳에 표시됩니다.

• 상태 표시줄에는 모든 오류 및 경고 수의 요약이 있습니다.
• 요약을 클릭하거나 ⇧⌘M (Windows, Linux Ctrl+Shift+M)을 눌 모든 현재 오류 목록이 포함된 **문제** 패널을 표시할 수 있습니다.
• 오류나 경고가 있는 파일을 열면 텍스트 내 및 개요 눈금자에 렌더링됩니다.

팁: 현재 파일에서 오류 또는 경고를 반복하려면 ⌥F8 (Windows, Linux Alt+F8) 또는 ⇧⌥F8 (Windows, Linux Shift+Alt+F8)를 누를 수 있습니다. 이렇게 하면 문제 및 가능한 코드 액션(있는 경우)을 자세히 설명하는 인라인 영역이 표시됩니다.

코드 액션

경고 및 오류는 문제를 해결하는 데 도움이 되는 코드 액션(빠른 수정이라고도 함)을 제공할 수 있습니다. 이는 편집기의 왼쪽 여백에 전구로 표시됩니다. 전구를 클릭하면 코드 액션 옵션이 표시되거나 액션이 수행됩니다.

인라인 힌트

일부 언어는 인라인 힌트를 제공합니다. 즉, 소스 코드에 대한 추가 정보를 인라인으로 렌더링합니다. 이는 일반적으로 추론된 유형을 표시하는 데 사용됩니다. 아래 샘플은 JavaScript 변수 및 함수 반환 유형의 추론된 유형을 표시하는 인라인 힌트를 보여줍니다.

인라인 힌트는 editor.inlayHints.enabled 설정을 사용하여 활성화/비활성화할 수 있으며, 기본값은 활성화입니다. TypeScript 또는 Rust와 같은 확장 기능은 실제 인라인 힌트 정보를 제공하는 데 필요합니다.

아웃바운드 링크 보호

보안을 위해 VS Code는 편집기에서 외부 웹사이트 링크를 열기 전에 프롬프트를 표시합니다.

브라우저에서 외부 웹사이트로 진행하거나 링크를 복사하거나 요청을 취소하는 옵션을 선택할 수 있습니다. 신뢰할 수 있는 도메인 구성을 선택하면 드롭다운 메뉴에서 정확한 URL을 신뢰하거나, URL 도메인 및 하위 도메인을 신뢰하거나, 모든 도메인을 신뢰하여 아웃바운드 링크 보호를 비활성화할 수 있습니다.

명령 팔레트에서 언제든지 사용할 수 있는 신뢰할 수 있는 도메인 관리 옵션은 **신뢰할 수 있는 도메인** JSON 파일을 엽니다. 여기서 신뢰할 수 있는 도메인을 추가, 제거 또는 수정할 수 있습니다.

// You can use the "Manage Trusted Domains" command to open this file.
// Save this file to apply the trusted domains rules.
[
  "*.twitter.com"
]

**신뢰할 수 있는 도메인** JSON 파일에는 지원되는 도메인 형식의 예와 기본적으로 신뢰되는 도메인 목록(예: https://*.visualstudio.com 및 https://*.microsoft.com)에 대한 주석도 포함되어 있습니다.

다음 단계

이제 편집기가 작동하는 방식을 알았으니, 다른 몇 가지를 시도해 볼 시간입니다...

• 소개 영상 - 코드 편집 - 코드 편집 기능에 대한 소개 영상을 시청하세요.
• 사용자 인터페이스 - VS Code의 기본 구성을 놓쳤다면 살펴보세요.
• 키 바인딩 - 키보드 단축키를 원하는 대로 수정하는 방법을 알아보세요.
• 디버깅 - VS Code가 진정한 빛을 발하는 부분입니다.

자주 묻는 질문

빠른 열기에서 첫 번째 항목 대신 두 번째 항목을 자동으로 선택하려면 어떻게 해야 하나요?

workbench.action.quickOpenPreviousEditor 명령을 사용하면 빠른 열기에서 두 번째 항목이 자동으로 선택되도록 할 수 있습니다. 이렇게 하면 키보드 단축키를 다시 호출할 필요 없이 목록에서 이전 항목을 선택하려는 경우 유용할 수 있습니다.

[
  {
    "key": "ctrl+p",
    "command": "workbench.action.quickOpenPreviousEditor"
  },
  {
    "key": "ctrl+p",
    "command": "-workbench.action.quickOpen"
  }
]

Ctrl+Tab을 모든 그룹의 모든 편집기 간을 이동하도록 구성하려면 어떻게 해야 하나요?

기본적으로 Ctrl+Tab은 동일한 편집기 그룹의 편집기 간을 이동합니다. 모든 그룹의 모든 열린 편집기 간을 이동하려면 workbench.action.quickOpenPreviousRecentlyUsedEditor 및 workbench.action.quickOpenLeastRecentlyUsedEditor 명령에 대한 키보드 단축키를 만들 수 있습니다.

[
  {
    "key": "ctrl+tab",
    "command": "workbench.action.quickOpenPreviousRecentlyUsedEditor",
    "when": "!inEditorsPicker"
  },
  {
    "key": "ctrl+shift+tab",
    "command": "workbench.action.quickOpenLeastRecentlyUsedEditor",
    "when": "!inEditorsPicker"
  }
]

피커 없이 최근 사용한 편집기 간을 이동하려면 어떻게 해야 하나요?

피커를 열지 않고 편집기 간을 이동하는 데 사용할 수 있는 명령 목록입니다.