[비쥬얼스튜디오코드] 확장프로그램 추가

- extension(확장기능)을 비쥬얼스튜디오 코드에서 사용하기

 

※ 비쥬얼스튜디오코드는 emmet(검색목록)을 따로 설치하지 않아도 기본적으로 사용가능함

다만, 해당 언어(html,css,js)로 파일을 저장한 후 코딩해야  emmet단축키(tab)가 작동됨

 

확장기능 스토어(Market Place)

https://marketplace.visualstudio.com/

Visual Studio Marketplace

 

비쥬얼 스트디오 코드 왼쪽 사이드 바에서 아이콘 클릭 후 검색해서 설치바람

 

 

☆ 확장기능 ☆ 

 

- Auto Rename Tag

 : 자동으로 여는 태그와 닫는 태그를 같이 수정

- ESLint

 : 스타일 규칙 준수를 검수해주는 수행도구

 

- Active File In StatusBar

 : 현재 작업중인 파일의 경로를 상태창에 표시해줌

 

근데 지금보니 그냥 기본적으로 헤더바에 표시해주는데 굳이 따로 깔아야하나 싶고...?

 

 

- colorize

 : 작성한 코드의 색상을 표시해줌

 

그냥 내 코드가 이뻐보이니까.......

 

- Bracket Pair Colorizer

 : 들여쓰기 가이드라인을 표시 해줌

 

- debugger for chrome

- prettier - code fomatter

 : 작성된 코딩을 코딩 컨벤션대로 정렬해주는 도구

- one dark pro(스킨 테마)

- bookmarks

 

Sass관련 확장기능

(node.js가 깔려있다는 전제)

- sass 

- sass Lint

- live sass compiler

 : sass를 css로 자동으로 변경해주는 확장프로그램

 

라이브 서버 확장기능

- live server

 

 

 

 

+ 추가

- vsvscode-icons

 : 아이콘 표시로 해당파이들을 쉽게 구분할 수 있게 도와줌