Programming/개발 툴

Visual Studio Code(VSCode) 에디터 설치하기

개발도비 2022. 11. 16. 09:44

https://code.visualstudio.com/

 

Visual Studio Code - Code Editing. Redefined

Visual Studio Code is a code editor redefined and optimized for building and debugging modern web and cloud applications.  Visual Studio Code is free and available on your favorite platform - Linux, macOS, and Windows.

code.visualstudio.com

 

공식 홈페이지에 접속한다 

 

 

OS에 맞게 프로그램을 설치한다 

 

 

1) 아이콘 추가 : 바탕 화면에 VSCode 아이콘 만들기.
2) 두 번째, 세 번째 "code(으)로 열기" : 폴더나 파일을 VSCode로 바로 열 수 있도록

마우스 우클릭 메뉴에 code(으)로 열기를 표시해준다.
3) VSCode를 기본 편집기로 사용하고 싶은 경우 체크.
4) PATH에 추가 :  명령 창(CMD, 파워셀 등)에서 code를 입력하면 VSCode가 바로 실행 된다.

 

 

 

+) 한글 팩 설정 바꾸기 

 

 

처음 설치하고 실행하면 팝업이 뜬다. 여기서 설치 및 다시 시작을 눌러준다.

 

 

아니면 왼쪽의 '확장'(Ctrl+Shift+X)에서 Korean을 검색한다. 

Korean Language Pack for Visual Studio Code를 인스톨해준 후 프로그램을 재실행한다. 

 

 

+) 코드 자동정렬 확장 프로그램 설치 

Prettier 검색해서 Install

 

설치가 완료되었으면 Control + Shift + P 

방금 설치한 프리티어라는 확장프로그램을 좀더 제대로 쓰기 위해 VSCode의 세팅을 바꿔볼 것

 

UI 클릭하기 

format on save 검색해서 체크박스에 체크해주기 (저장버튼 눌렀을 때 파일 포맷팅하라는 것) 

 

 

+) 파일의 확장자 아이콘 

Control + shift + P 

 

Material Icons: Activate Icon Theme을 클릭해주면  

 

이런식으로 아이콘이 뜬다! 

 

 

Reference https://goddaehee.tistory.com/287

 

[ VSCode ] Visual Studio Code 설치하기(및 추천 플러그인 설치)

[ VSCode ] Visual Studio Code 설치하기(및 추천 플러그인 설치) 안녕하세요. 갓대희 입니다. 이번 포스팅에선 Visual Studio Code를 설치 해보려 합니다. :- ) 웹개발을 하다보면 어떤 IDE를 사용할지 고민하곤

goddaehee.tistory.com