danbibibi
article thumbnail

로그 파일을 분석할 때 특정 키워드들을 색상별로 구분해서 보고 싶을 때가 있습니다.

VSCode의 Highlight 확장을 사용하면 간단하게 설정할 수 있습니다.

확장 설치

VSCode Extensions에서 "Highlight" 검색 후 설치

  • 작성자: Fabio Spampinato
  • 또는 "Log File Highlighter"도 추천 (로그 파일 전용)

설정 파일 열기

  1. Ctrl + Shift + P (Mac: Cmd + Shift + P)
  2. "Preferences: Open User Settings (JSON)" 입력
  3. settings.json 파일이 열림

하이라이팅 설정 추가

settings.json 파일의 "highlight.regexes" 섹션에 아래 코드 추가:

"highlight.regexes": {
    "(>{20,})": {
        "filterFileRegex": ".*\\.(log|txt)$",
        "decorations": [
            {
                "backgroundColor": "#ff0000",
                "color": "#ffffff",
                "fontWeight": "bold"
            }
        ]
    },
    "(TEST FAIL)": {
        "filterFileRegex": ".*\\.(log|txt)$",
        "decorations": [
            {
                "backgroundColor": "#00ff00",
                "color": "#000000",
                "fontWeight": "bold"
            }
        ]
    },
    "(CRASH)": {
        "filterFileRegex": ".*\\.(log|txt)$",
        "decorations": [
            {
                "backgroundColor": "#ffff00",
                "color": "#000000",
                "fontWeight": "bold"
            }
        ]
    }
}

적용하기

  1. 설정 파일 저장
  2. Ctrl + Shift + P → "Developer: Reload Window"
  3. 로그 파일(.log, .txt)을 열면 자동으로 하이라이팅 적용!

커스터마이징 팁

색상 변경

  • backgroundColor: 배경색
  • color: 글자색
  • 색상 코드는 HEX 형식 사용 (예: #ff0000 = 빨강)

추천 색상 조합

"backgroundColor": "#ff0000",  // 빨강 - 에러용
"backgroundColor": "#ffa500",  // 주황 - 경고용
"backgroundColor": "#ffff00",  // 노랑 - 정보용
"backgroundColor": "#00ff00",  // 초록 - 성공용
"backgroundColor": "#0000ff",  // 파랑 - 디버그용

정규식 패턴 예시

"(error|ERROR|Error)":        // OR 조건
"(>{20,})":                   // > 기호 20개 이상
"(\\d{4}-\\d{2}-\\d{2})":     // 날짜 형식 (YYYY-MM-DD)

주의사항

  • filterFileRegex로 적용할 파일 확장자 지정 가능
  • 너무 많은 키워드를 추가하면 성능 저하 가능
  • 정규식 특수문자는 \\로 이스케이프 필요
profile

danbibibi

@danbibibi

꿈을 꾸는 시간은 멈춰 있는 것이 아냐 두려워하지 마 멈추지 마 푸른 꿈속으로