티스토리 뷰
목차
마이크로소프트에선 2019년 10월 9일(미국 시간), Windows, macOS, Linux에 대응하는 크로스 플랫폼 에디터 "Visual Studio Code(이하 VS Code 비주얼 스튜디오 코드)"의 최신 버전인 September 2019(버전 1.39)를 공개했습니다.
VS Code 버전 1.39에는 편집기 기능과 워크 벤치, 통합 터미널, 언어 관련 디버깅 기능 등 많은 개선 사항이 있었는데요. 이중 쓸만한 기능 5개를 소개합니다.
에디터(편집기) 기능 : 텍스트 선택 영역을 미니맵에 표시
텍스트 선택 영역을 미니맵으로 강조 표시하도록 개선되었습니다.
선택 영역의 색상을 변경하려면 "minimap.selectionHighlight" 테마 색상을 변경합니다. 호불호가 갈리는 기능인데, 소스가 눈에 익으면 미니맵 보는 게 더 편리해집니다. Visual Studio Code 2019, 비주얼 스튜디오 모두 마찬가지입니다.
에디터(편집기) 기능 : 접이식 토글 동작 개선
접기 영역의 확장 및 축소를 "Toggle Fold" 명령어(단축키)로 빠르게 실행할 수 있게 되었습니다. [Ctrl] + [K] 키나 [Ctrl] + [L] 키로 실행할 수 있습니다.
워크 벤치 : 소스 관리 뷰를 개선
소스 관리 뷰를 개선하고 최신 트리 위젯을 사용하게 되었습니다. 소스 관리 제목 표시줄의 "Toggle View Mode" 버튼으로 목록 보기 및 트리 보기 전환이 가능합니다.
기본 화면의 디폴트 설정값은 "scm.defaultViewMode"를 사용하여 변경할 수 있습니다. 이 설정은 "list"또는 "tree"의 값을 받습니다.
또한, 뷰에서 문자를 입력하면 업데이트된 위젯의 자동 키보드 탐색 및 필터링이 작동하게 됩니다. (아래 gif 움짤 참조)
통합 터미널 : 사용자 지정 작업 디렉토리에 새로운 터미널 여는 기능 추가
제가 생각하는 최고의 기능인데요. 사용자의 현재 작업 디렉토리(cwd)에서 터미널을 만들 수 있는 새로운 명령어가 추가되었습니다.
사용자가 지정한 작업 디렉토리에 새로운 터미널을 열 수 있는 키보드 바로 가기를 만들 수 있습니다. 작업 디렉토리를 기반으로 여러 위치가 설정된 터미널을 생성 및 설정 할 수 있습니다. "cwd"의 값은 정상 경로 또는 변수로 지정합니다.
비슷한 기능이 비주얼스튜디오에 있었지만, 인기가 없어 사라진 걸로 기억납니다. 아무래도 Visual Studio Code에서는 Vue js, TypeScript 등이 구동되며 서버를 띄워야 하므로, 터미널 관련 기능엔 사람들의 이목이 집중될 수밖에 없지 않을까요.
언어 대응 : HTML ARIA 속성의 참조 링크를 추가
HTML ARIA 속성의 자동 완성이나 호버 정보에 해당하는 WAI-ARIA 문서 참조를 포함하게 되었습니다.
언어 대응 : CSS 속성 라인에 세미콜론을 추가
CSS 속성을 기술 시, 라인 끝에 세미콜론을 삽입할 수 있도록 개선되었습니다.
[Ctrl] + [Enter] 키 (Windows 및 Linux) 또는 [Cmd] + [Enter] 키 (macOS)를 누르면 새로운 줄에 세미콜론을 삽입할 수 있습니다.
이 기능을 관리하려면 "[css|scss|less].completion.completePropertyWithSemicolon" 설정을 사용합니다.
언어 대응 : CSS 색상 변수 프리뷰 (컬러 변수 미리보기)
CSS 변수를 정의할 때, 변수가 컬러 문자열인 경우 뒤에 컬러를 표시합니다. 이 기능 정말 좋아요.
디버깅 기능 : 컬럼 브레이크 포인트 UI 개선
디버깅 중에 모든 브레이크 포인트 위치를 인라인으로 표시합니다. 이를 통해 개발자는 중단점을 더 정확한 위치에 배치할 수 있습니다. 사용자 인터페이스(UI)가 복잡해지지 않는 범위에서, 행 안의 브레이크 포인트 활성화 위치 후보 지점을 표시합니다.
인라인 브레이크 포인트를 직접 조작 할 수 있습니다. (당연하게도) 마우스로 클릭하여 활성화 / 비활성화로 전환하거나 컨텍스트 메뉴를 호출하고 있습니다.
디버깅 기능 : CALL STACK 뷰에서 인라인 디버깅 작업
호출된 스택뷰에서 디버깅 흐름을 관리하기 쉬워집니다.
이상 Visual Studio Code 1.39 주요 기능 9개 살펴봤습니다.
비주얼 스튜디오 코드 관련 글은 아래에 있으니 참고하세요.