알쓸신잡(알아두면 쓸데없는 신비한 잡학사전)

[ VSCODE_주석꾸미기 ] Todo Tree로 //TODO 주석 색상 설정하기

ChatjihoiPT 2025. 4. 23. 16:45
 

코딩 시에 TODO의 색상을 설정하여 더 잘 보이게 만들어주는 꿀확장자!


TODO 주석 색상 설정하는 법

1. Todo Tree 설치

✅ VS code의 확장자(EXTENSIONS)에 들어가서 Todo Tree를 설치(Install)한다.


2. VS code의 설정

 

✅ VSCode에서 설정(Settings) 열기 단축키

운영체제 단축키
🪟 Windows / Linux Ctrl + , (컨트롤 + 콤마)
🍎 macOS (맥) ⌘ + , (Command + 콤마)

 

✅ Edit in settings.json 클릭


3. settings.json에 코드 추가

 

✅ 추가해 줄 코드 ] 

,
  "todo-tree.highlights.defaultHighlight": {
    "icon": "alert",
    "type": "text",
    "foreground": "black",  // 글꼴 색상 변경 가능
    "background": "pink",   // 배경 색상 변경 가능
    "opacity": 50,
    "iconColour": "blue"
  },
  "todo-tree.highlights.customHighlight": {
    "TODO": {
      "icon": "check",
      "type": "line"
    },
    "FIXME": {
      "foreground": "black",
      "iconColour": "yellow",
      "gutterIcon": true
    }
  }

 

settings.json 파일에 들어가 가장 하단 노란색 } 위에 코드를 복붙해준다.


4. 결과

✅  //TODO 주석의 배경색과 글자색을 바꿀 수 있다.

TODO 주석 색상 변경 완료!

 

✅ 왼쪽 중간에 생긴 Todo Tree를 누르면 어느 파일에 TODO 주석이 있는지도 확인 가능!!

파일 속 TODO List 아주 Easy하게 찾기~