VS Code 셋팅하기 - 1
VS Code 셋팅하기 - 1
Themes 변경
VS Code에서는 선택할 수있는 많은 테마들이 있다. 그중에서 인기있고 가장 많이 쓰는 테마들 입니다.
밝은테마 | 어둔운테마 | 재밌는테마 |
---|---|---|
Hop Light | Night Owl | Slack |
Night Owl Light | Cobalt2 | Hot Dog Stand |
Min | Noctis | wind95 |
Noctis | Dracula |
단축키를 사용해서 Command Palette(ctrl + shift + P) 를 누른다
기본설정 색 테마를 누르고
원하는 테마를 선택한다. 테마가 없는 경우 마켓플레이스에서 설치 한다.
icon 변경
아이콘 테마는 탐색기 파일, 폴더, 프로젝트 등 아이콘을 변경한다.
VS Code Can Do That 확장팩에는 두가지 아이콘 테마가 포함되어 있다.
- Material Icons
- Chalice Icons
단축키를 사용해서 Command Palette(ctrl + shift + P) 를 누른다
Material Icons 테마를 선택한다.
Chalice Icons 테마를 선택한다.
Font 변경
무료 폰트 | 유료 |
---|---|
FiraCode | Dank Mono |
Hasklig | Operator Mono |
Monoid | Pragmata Pro |
폰트를 다운로드 하고 VS Code 셋팅 방법
- Ctrl + , 눌러서 Settings Editor 실행한다
- Font 검색한다.
- 새로운 폰트를 입력한다.
예제) FriaCode Git Hub (링크로) 들어간다
- 최신 releases로 들어가 zip 파일 다운로드를 한다.
- os에 글꼴 설치를 한다
- setting 가서 설정한다.
요렇게 이쁘게 표현 가능
Editor 편집 부가 기능
Minimap 기능
미니맵은 긴 파일을 쉽게 탑색 할 수 있도록 우측에 디스플레이를 제공합니다. 하지만 읽을 수 없기 때문에 사용하지 않을 가능성이 높고 공간만 차지하므로 이 기능을 끄는 것을 추천 드립니다.
- ctrl + ,
- minimap 검색
- 미니맵 사용 끄기
side bar를 오른쪽으로 이동
- ctrl + shift + P
- toggle sidebar Position 선택
열려 있는 편집기 숨기기
기본적으로 VS Code는 Open Editors라고 있습니다 (열러있는 편집기)
열려있는 편집기 제거
- ctrl + ,
- open editors visible
- 편집기 열기 표시를 0으로 설정
editor instances를 쉽게 식별하기
우선 “Peacock” 확장프로그램을 설치 한다.
- Ctrl + shift + P
- Peacock 색상입력을 선택
- 원하는 색상 입력 (Ex ffa07a)
VS Code / 확장 다운로드 목록 (/w 김도은)
- Auto Close Tag
- ESLint
- Korean Language Pack for
- Live Server
- Material Icon Theme
- Night Owl
- Prettier
- Vetur
- Vue 3 Snippets
- Vue VSCode Snippets
- Eclipse Keymap