개인적인 VSCode 익스텐션 정리 (카테고리별)

설정 켜기 : Ctrl + ,
settings.json 켜기 : Ctrl + shift + p

%APPDATA%\Code\User\settings.json

0. Continue (AI 코딩)

(세팅 링크)

 

1. 코드 스타일 & 포맷팅

• Prettier - Code formatter: 코드 가독성 (default formatter 변경, 저장 시 자동 포맷팅(on save) 활성화
• ESLint: 코드 품질과 일관성 (별도 규칙 설정 필요)

-> Continue로 대체

 

2. 주석 & TODO 관리

• TODO Tree: TODO / FIXME 주석 강조 및 트리 형태로 !!
  https://github.com/Gruntfuggly/todo-tree

세팅 예시

3. 코드 탐색 & 자동 완성

• Path Intellisense : 파일 경로 자동 완성 (직접하려고 안씀)
• Emmet, Wrap with Abberviation : Contiunue로 대체

4. 디버깅 & 에러 검사

• Error Lens: 에러, 경고 직접 표시
• Code Spell Checker: 스펠링 오류 검사 -> VSCode 느려지는거 싫어서 뺌

5. Git 연동

• GitLens: Git 시각화. 코드 변경 이력 파악

6. 웹 개발 편의 기능

• Live Preview: 브라우저 안 들어가고 확인
• Auto Close Tag, Auto Rename Tag: TypeScript 코드 작성시 문제생긴다고해서 안씀

Live Preview 사용법

7. 디자인 & 테마

• Material Icon Theme: VSCode 아이콘 스타일 변경
• Color Highlight: 코드 내 색상 값 강조 표시

 

+ Bracket Pair Colorizer: 괄호 쌍을 색상으로 구분 -> vscode 설정으로 들어