이 출시되었습니다! 11월의 새로운 기능 및 수정 사항을 읽어보세요.

2021년 6월 (버전 1.58)

업데이트 1.58.1: 해당 업데이트는 다음 보안 문제를 해결합니다.

업데이트 1.58.2: 해당 업데이트는 다음 이슈를 해결합니다.

다운로드: Windows: x64 Arm64 | Mac: Universal Intel silicon | Linux: deb rpm tarball Arm snap


Visual Studio Code 2021년 6월 릴리스에 오신 것을 환영합니다. 이번 버전에는 여러분이 좋아하실 만한 여러 업데이트가 포함되어 있으며, 주요 하이라이트는 다음과 같습니다.

이 릴리스 노트를 온라인으로 읽으려면 code.visualstudio.com업데이트로 이동하십시오.

라이브로 참여하세요! 7월 13일 화요일 오전 8시 (태평양 표준시, 런던 오후 4시)에 VS Code 팀의 라이브 스트림에서 이번 릴리스의 새로운 기능을 시연하고 질문을 실시간으로 받아봅니다.

Insider: 새로운 기능을 최대한 빨리 사용해 보고 싶으신가요? 야간 빌드인 Insider 빌드를 다운로드하고 사용 가능한 최신 업데이트를 즉시 사용해 보세요.

워크벤치

작업 영역 신뢰

작업 영역 신뢰 기능은 1.57 릴리스에서 큰 변화를 가져왔으며, 개발자가 출처를 알 수 없는 코드라도 안전하게 탐색할 수 있다는 점이 중요하다고 생각합니다. 이번 마일스톤에서는 고객 피드백을 흡수하고 이슈 수정 및 제안 후속 조치에 집중했습니다.

사용자가 작업 영역 신뢰를 사용자 지정할 수 있는 사용자 설정을 발견하는 데 도움이 되도록, 작업 영역 신뢰 편집기 헤더에 새로운 설정 구성 작업이 추가되었습니다. 이 작업은 @tag:workspaceTrust로 필터링된 설정 편집기를 엽니다.

Configure your settings action in the Workspace Trust editor

설정 얘기를 하자면, 현재 창이 제한 모드임을 나타내는 배너가 언제 표시될지 구성하는 새로운 설정이 있습니다. security.workspace.trust.startupPrompt 설정과 유사하게, 새로운 security.workspace.trust.banner를 사용하면 작업 영역 신뢰 기능에 익숙해져 제한 모드에서 작업 중임을 알리는 알림이 더 이상 필요 없을 때 배너를 비활성화할 수 있습니다. 기본적으로 이 배너는 작업 영역당 한 번 표시되며 사용자가 해제할 때까지 ("untilDismissed") 유지됩니다. 제한 모드 배너 표시의 다른 옵션은 "always""never"입니다.

최근 작업 영역 신뢰 블로그 게시물에서 작업 영역 신뢰의 이유와 개발에 대해 자세히 알아볼 수 있습니다. 이 게시물은 제한 모드가 의도하지 않은 잠재적으로 악의적인 코드 실행으로부터 사용자를 보호하는 방법을 설명하고, 개발 머신을 빠르고 안전하게 설정하는 팁을 제공합니다.

설정 편집기

이번 반복에서는 고정된 수의 부울 속성을 가진 설정 객체에 대해, 속성을 확인란 목록으로 렌더링하여 설정 편집기에 대한 지원을 추가했습니다.

Settings editor Boolean object renderer demo

이번 반복에서는 또한 열거형 배열에 대한 추가 지원을 위해, 편집 모드에서 일반 텍스트 상신 대신 드롭다운을 사용하도록 했습니다.

Settings editor enum array renderer demo

임시 작업 영역

이제 "임시" 작업 영역이라는 새로운 유형의 작업 영역이 있으며, 이는 일반 작업 영역과 다르게 작동합니다.

  • VS Code를 다시 시작하거나 다시 로드해도 작업 영역을 다시 열려고 시도하지 않습니다.
  • 임시로 설정된 작업 영역은 최근에 연 작업 영역 목록에 나타나지 않습니다.

작업 영역 .code-workspace 파일에 transient 속성을 true로 설정하여 임시 작업 영역을 지정합니다.

{
  "folders": [],
  "transient": true
}

설정 동기화

이제 설정 동기화를 위한 문제 해결 보기가 있으며, 여기에는 모든 로그와 마지막 동기화 상태가 포함됩니다. 이 보기에 액세스하려면 설정 동기화: 동기화된 데이터 표시 명령을 실행하고 보기 하위 메뉴를 열어 문제 해결을 선택하여 활성화할 수 있습니다.

Settings Sync Troubleshoot command in the Settings Sync view menu

테마: GitHub Light Theme

검색 최대 결과 설정

텍스트 검색 결과의 최대 개수를 설정할 수 있는 새로운 설정, search.maxResults가 있습니다. 기본값은 이전의 10,000개에서 20,000개로 증가했습니다. 매우 많은 수의 검색 결과를 로드할 때 느려짐이 발생할 수 있습니다.

통합 터미널

편집기 영역의 터미널

이제 편집기 영역에서 터미널을 생성하거나 이동할 수 있으며, 패널 상태에 관계없이 유지되고 계속 표시되는 다차원 그리드 레이아웃을 사용할 수 있습니다.

편집기 영역에서 터미널을 사용하려면 다음 옵션이 있습니다.

  • 편집기 영역에서 터미널 만들기 명령을 통해 생성합니다.
  • 탭 목록에서 터미널을 편집기로 드래그 앤 드롭합니다.
  • 터미널이 포커스된 상태에서 편집기 영역으로 터미널 이동을 실행합니다.
  • 터미널 탭 컨텍스트 메뉴에서 편집기 영역으로 이동을 선택합니다.

4 terminals in the editor area are laid out in a 2 by 2 grid

새로운 terminal.integrated.defaultLocation 설정을 editor로 설정하여 새로 생성된 터미널이 기본적으로 편집기 영역으로 이동하도록 할 수 있습니다.

캔버스 렌더러 명시적 설정

이전 반복에서 WebGL 터미널 렌더러를 기본값으로 활성화하고 terminal.integrated.rendererType 설정을 더 간단한 terminal.integrated.gpuAcceleration으로 대체했습니다. 안타깝게도 일부 머신에서는 WebGL 환경이 저하되어 GPU 가속을 완전히 비활성화하고 훨씬 느린 DOM 기반 렌더러로 전환하는 것 외에 다른 옵션이 없었습니다. 이제 terminal.integrated.gpuAccelerationcanvas로 명시적으로 설정할 수 있으며, 이는 이러한 환경에 더 적합할 수 있습니다.

새로운 terminal.integrated.showLinkHover 설정을 사용하면 터미널에서 링크 호버를 비활성화할 수 있습니다. 터미널 링크에 대한 호버가 산만하다고 생각되는 경우 유용할 수 있습니다.

편집기

편집기 스크롤 막대 사용자 지정

편집기의 스크롤 막대를 사용자 지정하는 새로운 설정이 있습니다.

  • editor.scrollbar.horizontaleditor.scrollbar.vertical을 사용하여 스크롤 막대 표시를 제어합니다.
  • editor.scrollbar.horizontalScrollbarSizeeditor.scrollbar.verticalScrollbarSize로 두께를 변경합니다.
  • 클릭이 페이지 단위로 스크롤할지 또는 클릭 위치로 점프할지 (기본 동작) 여부를 editor.scrollbar.scrollByPage를 사용하여 결정합니다.

편집기 수직 스크롤 막대 너비 아래는 30픽셀로 설정됩니다.

Vertical editor scroll bar width set to 30 pixels

언어

마크다운 미리 보기에서 수학 공식 렌더링

VS Code의 내장 마크다운 미리 보기는 이제 KaTeX를 사용하여 수학 방정식을 렌더링할 수 있습니다.

Math rendering in the built-in Markdown preview

인라인 수학 방정식은 단일 달러 기호로 묶입니다.

Inline math: $x^2$

이중 달러 기호를 사용하여 수학 방정식 블록을 만들 수 있습니다.

Math block:

$$
\displaystyle
\left( \sum_{k=1}^n a_k b_k \right)^2
\leq
\left( \sum_{k=1}^n a_k^2 \right)
\left( \sum_{k=1}^n b_k^2 \right)
$$

이 기능을 비활성화하려면 "markdown.math.enabled": false를 설정할 수 있습니다.

마크다운 수학 공식 구문 강조

VS Code는 이제 마크다운 소스의 수학 방정식에 대한 강조 표시도 지원합니다.

Syntax highlighting of a math equation in a Markdown file

일반 마크다운 파일 및 노트북 내의 마크다운 셀 모두에서 작동합니다.

TypeScript 4.3.5

TS 4.3.5를 번들로 제공합니다. 이 마이너 업데이트는 JSX에서 자동 가져오기가 작동하지 않는 문제를 포함한 몇 가지 중요한 버그를 수정합니다.

디버깅

파일별 선택된 환경 기억

launch.json 파일 없이 디버깅을 시작할 때 VS Code는 활성 편집기를 확인하고 편집기의 언어 모드를 기반으로 어떤 디버그 확장을 사용할지 결정합니다. 그러나 일부 언어의 경우 여러 디버그 확장이 가능하며, 이 경우 VS Code는 하나를 선택하도록 요청합니다. 디버깅을 더 원활하게 하기 위해 VS Code는 이제 파일별로 선택된 디버거를 기억하므로, 다음에 디버깅을 시작할 때 프롬프트 없이 세션이 시작됩니다.

아래 짧은 비디오에서 사용자는 단일 JavaScript 파일을 디버깅하기 위해 Node.js 디버그 환경을 선택하고, 해당 파일에 대한 새 디버그 세션이 시작될 때 해당 선택이 기억됩니다.

Debug is started first time and the environment prompt is presented. The next time there is no prompt when the debug session starts

디버그 콘솔 제안이 더 이상 Enter 키로 수락되지 않음

디버그 콘솔 제안은 이제 Enter 키가 아닌 Shift+EnterTab 키로만 수락됩니다. 이전에는 디버그 콘솔 입력에 이미 입력된 내용을 평가하려는 경우 실수로 제안을 수락하기 쉬웠습니다.

Tab 키를 제안 수락 방법으로 더 쉽게 찾을 수 있도록, VS Code는 이제 디버그 콘솔 입력에 상태 표시줄 힌트("삽입 (Tab)")를 제공합니다.

Debug console input box showing a Status bar rendered in the bottom that says "Insert (Tab)"

확장 프로그램 기여

Jupyter 대화형 창

노트북 생태계 위에 내장 대화형 창 환경을 제공하기 위한 작업을 시작했으며, Jupyter 확장은 설정 jupyter.enableNativeInteractiveWindow 뒤에서 이를 채택했습니다. 이 기능이 활성화된 경우, Python 파일에서 코드를 실행하거나 명령 팔레트에서 직접 시작할 때 Jupyter 확장은 웹뷰 구현 대신 내장 편집기를 엽니다. 내장 편집기는 워크벤치와 깊이 통합되어 사용자 지정 키 바인딩/키맵 또는 언어 확장에서 작동합니다.

Jupyter built-in interactive window demo

Jupyter 노트북 디버깅

노트북 셀에 중단점을 설정하고, 셀을 단계별로 실행하며, 다른 모든 VS Code 디버거 기능을 사용할 수 있도록 Jupyter 노트북 디버깅 지원을 작업하고 있습니다. 이는 실험적인 기능이지만, "jupyter.experimental.debugging": true를 설정하고 선택한 커널에 ipykernel 버전 6을 설치한 다음, 노트북 도구 모음에서 디버그 버튼을 클릭하여 시험해 볼 수 있습니다.

Jupyter debugging

원격 저장소

이번 반복에서는 주로 원격 리포지토리 확장에 대한 버그 수정 및 성능 개선, 그리고 GitHub Pull Requests and Issues 확장과의 통합 개선에 중점을 두었습니다. 또한 원격 탐색기원격 리포지토리 보기에서 원격 리포지토리를 제거할 수 있으며, 라인 범위가 있는 \blob URL을 열 때 더 나은 지원을 제공합니다.

GitHub Pull Requests 및 Issues

GitHub Pull Requests and Issues 확장에 대한 이번 반복의 중점은 버그 수정이었습니다. 주요 내용은 변경 로그에서 확인할 수 있습니다.

원격 개발

컨테이너, 원격 머신 또는 Linux용 Windows 하위 시스템(WSL)을 전체 기능 개발 환경으로 사용할 수 있는 원격 개발 확장에 대한 작업이 계속 진행 중입니다.

1.58의 주요 기능 하이라이트는 다음과 같습니다.

  • 포워딩된 포트에 대해 브라우저를 한 번만 열도록 하는 옵션.
  • devcontainer.json에서 캐시된 이미지 지원.
  • Dev Containers가 "hostRequirements"를 확인합니다.

새로운 확장 기능과 버그 수정에 대한 내용은 원격 개발 릴리스 노트에서 확인할 수 있습니다.

라이브 미리보기

웹 개발 미리보기를 위한 로컬 서버를 호스팅하는 Live Preview 확장을 개발했습니다! 🎉

편집기 내 브라우저 미리보기, 라이브 미리보기 새로고침 (파일 변경 또는 저장 시), 다중 루트 지원 등이 포함되어 있습니다!

Live Preview Quick Walkthrough

이 확장은 지속적인 서버를 실행하고 서버 트래픽 및 관련 파일을 볼 수 있는 Live Preview 작업도 제공합니다.

Live Preview Tasks

기능에 대한 자세한 내용은 Marketplace에서 확인하거나 저장소를 확인하세요.

미리보기 기능

TypeScript 4.4 지원

이번 릴리스에는 곧 출시될 TypeScript 4.4 릴리스에 대한 초기 지원이 포함되어 있습니다. TypeScript 4.4의 새로운 언어 기능 및 개선 사항에 대한 자세한 내용은 TypeScript 블로그에서 확인할 수 있습니다.

TypeScript 4.4 nightly 빌드를 사용하려면 TypeScript Nightly 확장을 설치하세요.

피드백을 공유해 주시고 TypeScript 4.4에서 버그를 발견하면 알려주시기 바랍니다.

창 간 터미널 이동

이제 터미널: 세션 분리를 사용하여 한 창에서 분리하고 터미널: 세션 연결을 사용하여 다른 창에 연결함으로써 창 간에 터미널을 이동할 수 있습니다. 향후에는 이를 통해 창 간 드래그 앤 드롭을 지원할 수 있을 것입니다!

확장 프로그램 작성

자세한 완성 항목 레이블

더 자세하고 구조화된 완성 항목 레이블을 위한 새로운 API를 추가했습니다. 이제 vscode.CompletionItemLabel 유형을 항목 레이블에 사용할 수 있으며, 레이블, 세부 정보, 설명을 지정할 수 있습니다.

이러한 새로운 속성을 통해 언어 확장은 시그니처 또는 한정자를 표시할 수 있으며, 다른 완성 제공자도 이를 활용할 수 있습니다. 예를 들어, GitHub Pull Request and Issues 확장은 이제 별칭과 함께 전체 이름을 표시합니다.

Completion for Github aliases with full names

모달 메시지에 대한 세부 정보

모달 정보, 경고 및 오류 메시지를 표시하기 위한 API는 이제 세부 정보를 제공하는 것을 지원합니다. 세부 텍스트는 실제 메시지보다 아래에 덜 눈에 띄게 렌더링됩니다.

A modal dialog with details

위의 대화 상자는 다음 코드 조각으로 생성됩니다. 세부 텍스트는 모달 메시지(modal: true)에만 지원된다는 점에 유의하세요.

vscode.window.showInformationMessage('This is the message', {
  modal: true,
  detail:
    'This is the detail. Rendered less prominent, but with more space for, well, details.'
});

터미널 프로필 제공

이제 확장에서 터미널 프로필을 제공할 수 있으며, 프로필 선택기에 표시됩니다.

A contributed profile will show up along side detected and configured terminal profiles

터미널 프로필을 제공하려면 다음 세 가지를 수행해야 합니다.

먼저 package.json에 기여를 추가합니다.

"contributes": {
  "terminal": {
    "profiles": [
      {
        "title": "Custom Profile",
        "id": "custom_profile"
      }
    ]
  },
}

다음으로 사용자가 프로필을 요청할 때 확장이 활성화되도록 활성화 이벤트를 추가합니다.

"activationEvents": [
  "onTerminalProfile:custom_profile"
]

마지막으로 터미널을 생성하는 데 사용되는 옵션 세트를 반환하는 터미널 프로필 공급자를 등록합니다. 옵션은 표준 프로세스 기반 TerminalOptions 또는 사용자 지정 ExtensionTerminalOptions가 될 수 있습니다.

vscode.window.registerTerminalProfileProvider('custom_profile', {
  provideTerminalProfile() {
    return {
      options: {
        name: 'Profile from extension',
        shellPath: 'cmd.exe'
      }
    };
  }
});

ExtensionTerminalOptions 기반 터미널 이름 변경

새로운 Pseudoterminal.onDidChangeName 이벤트를 사용하면 ExtensionTerminalOptions로 생성된 터미널의 이름을 변경할 수 있습니다.

const writeEmitter = new vscode.EventEmitter<string>();
const nameEmitter = new vscode.EventEmitter<string>();
const pty = {
  onDidWrite: writeEmitter.event,
  onDidChangeName: nameEmitter.event,
  open: () => writeEmitter.fire('Press and key to set the terminal title'),
  close: () => {
    /* noop*/
  },
  handleInput: (data: string) => {
    writeEmitter.fire(`Set title to "${data}"`);
    nameEmitter.fire(data);
  }
};
const terminal = (<any>vscode.window).createTerminal({ name: `My Extension REPL`, pty });
terminal.show();

확장 API를 통해 생성된 터미널에 아이콘 설정

window.createTerminal은 이제 iconPath를 받아 탭에서 터미널과 아이콘을 연결합니다.

const term = vscode.window.createTerminal({
  name: `Serve`,
  iconPath: new vscode.ThemeIcon('server-process')
});
term.show();

The iconPath will show up next to the terminal's name

저장된 Memento 키 열거

저장된 Memento 키 집합을 열거하기 위한 새로운 Memento.keys() API가 있습니다. 이 API는 이전에 저장된 데이터를 더 쉽게 처리할 수 있게 해주고 저장된 데이터를 마이그레이션해야 하는 경우 유용할 수 있습니다.

언어 서버 프로토콜

언어 서버 프로토콜의 새로운 버전과 해당 npm 모듈이 게시되었습니다. 이 버전에는 진단 풀 모델 사양에 대한 최종 제안이 포함되어 있습니다.

디버그 어댑터 프로토콜

"메모리 쓰기" 요청 및 "메모리 변경" 이벤트 진행 상황

향후 VS Code 디버그 경험 버전에 메모리 뷰어를 통합할 계획입니다. 이 지원을 위해 ReadMemory 요청은 디버그 어댑터 프로토콜에 이미 존재합니다. 이제 해당 WriteMemory 요청 및 Memory 이벤트를 작업 중입니다. WriteMemory 요청에는 다음 마일스톤에 DAP에 추가될 최종 제안이 있습니다. Memory 이벤트 제안은 아직 논의 중입니다. 디버그 확장 작성자이며 이러한 DAP 프로토콜 추가에 관심이 있다면 피드백을 부탁드립니다.

제안된 확장 API

모든 마일스톤에는 새로운 제안 API가 제공되며 확장 작성자는 이를 사용해 볼 수 있습니다. 언제나처럼 여러분의 피드백을 원합니다. 제안된 API를 사용하려면 다음을 수행해야 합니다.

  • 제안된 API는 자주 변경되므로 Insiders를 사용해야 합니다.
  • 확장의 package.json 파일에 이 줄이 있어야 합니다: "enableProposedApi": true.
  • vscode.proposed.d.ts 파일의 최신 버전을 프로젝트 소스 위치로 복사합니다.

제안 API를 사용하는 확장은 게시할 수 없습니다. 다음 릴리스에서 호환성이 깨지는 변경 사항이 있을 수 있으며, 기존 확장을 깨뜨리는 일은 절대 없을 것입니다.

풍부한 상태 표시줄 호버

상태 표시줄 항목에 대한 풍부한 호버를 지원하는 새로운 제안 API가 있습니다. 이를 시험해 보려면 StatusBarItem.tooltip2MarkdownString을 제공하세요.

Rich Status bar hover

  • MarkdownString.supportThemeIcons가 true이면 $(iconName) 구문을 사용하여 아이콘을 사용할 수 있습니다.
  • MarkdownString이 신뢰되면 명령 링크도 추가할 수 있습니다. 구문: ([test](command:vscode.newWindow))

테스트

테스트 API 최종 확정을 향한 행진이 계속됩니다. 이번 반복에서는 확장 호스트의 다른 API 스타일과 더 잘 일치하도록 일부 테스트 API를 리팩터링했습니다. 최종 확정 프로세스를 추적하고 API 변경 사항에 대한 소식을 들으려면 이슈 #122208을 팔로우하세요.

예상되는 주요 변경 사항은 "실행 구성"을 제공하는 방식입니다. 이러한 러너 API의 진행 상황을 추적하거나 의견을 말하려면 이슈 #127096을 팔로우하세요.

마지막으로 테스트 커버리지 조사 및 초기 구현을 시작했으며, 이는 앞으로 몇 주 동안 UI에 노출될 것입니다.

인라인 제안

인라인 제안 API는 확장이 제안 위젯과 분리된 인라인 제안을 제공할 수 있도록 합니다. 인라인 제안은 이미 수락된 것처럼 회색으로 렌더링됩니다. 사용자는 제안을 순환하고 Tab 키로 수락할 수 있습니다.

vscode.languages.registerInlineCompletionItemProvider(
  { pattern: '**' },
  {
    provideInlineCompletionItems: async (document, position) => {
      return [{ text: '< 2) {\n\treturn 1;\n\t}' }];
    }
  }
);

Inline suggestions in the editor

엔지니어링

ES2020

TypeScript 프로젝트를 업데이트하여 Promise.allSettled 또는 String.replaceAll과 같은 최신 JavaScript API를 사용할 수 있게 했습니다. 또한 더 현대적인 JavaScript인 ES2020을 출력하여 주 번들의 전체 크기를 약간 줄였습니다.

Electron 샌드박스 지원을 위한 진행 상황

이번 마일스톤에서는 Electron의 샌드박스컨텍스트 격리 기능을 활성화하기 위해 VS Code 창을 계속 준비했습니다.

구체적으로

  • VS Code 창을 일반적으로 열기 위해 필요한 리소스를 로드하기 위한 Node.js 종속성을 제거했습니다.
  • iframe 요소에 대한 검색을 추가하여 폐기된 webview 컴포넌트와 더 유사한 동작을 얻고 향후 webview를 제거할 수 있도록 했습니다. 이 기능은 settings.json 파일에서 "webview.experimental.useIframes": true를 설정하여 활성화할 수 있습니다.

문서

데이터 과학 튜토리얼 및 주제

데이터 과학 튜토리얼 및 주제가 이제 https://vscode.gisul.kr 목차의 자체 섹션 아래에 있습니다. Jupyter Notebook 사용에 대한 튜토리얼, Python 대화형 창, 그리고 타이타닉 승객 데이터를 분석하는 데이터 과학 튜토리얼도 찾을 수 있습니다.

Data Science table of contents on code.visualstudio.com

주요 수정 사항

  • 120956: iPad: 편집기 외부에서 컨텍스트 메뉴를 트리거할 수 없음
  • 122448: 확장 프로그램의 종속성이 비활성화된 경우 자동으로 비활성화
  • 124169: 활성 디버깅 줄에 들여쓰기하지 않도록 시도
  • 125144: 스레드가 더 이상 중지되지 않을 때 초점이 다른 스레드로 자동 전달되지 않음
  • 125528: 더 이상 중지되지 않는 중단점에서 중단점 보기 선택 해제
  • 126211: 디버거를 통해 시작된 Node 프로세스가 VS Code 종료 시 종료되지 않음
  • 126702: macOS: 명령줄 code .가 작동하지 않음
  • 127716: 디버그 호버: 키보드를 사용하여 속성 검색 허용

감사합니다

마지막으로, 이번 달 VS Code에 기여해주신 다음 분들께 진심으로 감사드립니다.

이슈 추적에 대한 기여

vscode 기여

vscode-extension-samples 기여

vscode-html-languageservice에 대한 기여

vscode-js-debug 기여

vscode-languageserver-node에 기여

language-server-protocol 기여

monaco-editor 기여

monaco-languages에 대한 기여

monaco-typescript에 대한 기여

© . This site is unofficial and not affiliated with Microsoft.