Featured image of post [VSCode] VS Code에서 정규식을 활용한 문자열 치환 방법
VSCode Regex Development

[VSCode] VS Code에서 정규식을 활용한 문자열 치환 방법

VS Code(Visual Studio Code)는 다양한 언어와 도구를 지원하는 강력한 코드 에디터이다. 여러 기능 중에서도 정규식(Regular Expression)을 활용하여 효율적으로 텍스트를 검색하고 수정할 수 있다는 점은 많은 개발자들에게 유용한 기능이다. 본 블로그 글에서는 VS Code에서 정규식을 통해 텍스트를 찾아 바꾸는 방법을 간단히 살펴보고, 예시로 제시된 ^- ([a-zA-Z]+)\s([a-zA-Z]+)\s([a-zA-Z]+)$와 - \u$1\u$2\u$3 구문을 활용하여 변경하는 방안을 구체적으로 알아보도록 하겠다.

VS Code에서 정규식 검색 기능 사용하기

VS Code에서 텍스트를 검색하려면 기본적으로 Ctrl + F(Windows/Linux) 또는 Cmd + F(Mac)을 사용하면 된다. 여기서 더 복잡한 패턴을 찾고 싶다면 검색창 왼쪽의 .* 아이콘(정규식 버튼)을 클릭하여 정규식 모드를 활성화하면 된다. 정규식 모드가 켜지면, 검색 창에 입력한 문자열이 일반 텍스트가 아니라 정규식으로 인식되어, 다양한 패턴 매칭을 진행할 수 있게 된다.

정규식을 활용함으로써 다음과 같은 작업을 손쉽게 처리할 수 있다.

  • 특정 패턴의 단어 또는 기호 검색
  • 문자열의 앞뒤에 특정 텍스트가 있는지 확인
  • 그룹 캡처로 원하는 부분만 치환

이러한 유용성 덕분에 많은 개발자들이 VS Code에서 정규식을 적극 활용하여 작업 시간을 단축하곤 한다.

예시 정규식: ^- ([a-zA-Z]+)\s([a-zA-Z]+)\s([a-zA-Z]+)$

이번 글에서 예시로 제시된 정규식은 다음과 같다.

1
2

찾기(Find): ^- ([a-zA-Z]+)\s([a-zA-Z]+)\s([a-zA-Z]+)$
바꾸기(Replace): - \u$1\u$2\u$3

이 패턴이 의미하는 바를 살펴보자.

  1. ^- : 문자열의 시작(^)에서 대시(-) 뒤에 공백이 오는 패턴이다.
  2. ([a-zA-Z]+)\s([a-zA-Z]+)\s([a-zA-Z]+)$: 영문 알파벳(대소문자 구분 없음)이 하나 이상 반복되는 단어(([a-zA-Z]+))가 공백(\s)을 두 번 사이에 두고 총 세 개 등장하며, 문자열 끝($)까지 매칭되는 패턴이다.
    • 첫 번째 단어는 ([a-zA-Z]+)로 캡처 그룹 $1이 됨
    • 두 번째 단어는 ([a-zA-Z]+)로 캡처 그룹 $2가 됨
    • 세 번째 단어는 ([a-zA-Z]+)로 캡처 그룹 $3이 됨

즉, 예시로 “- foo bar baz” 같은 형태의 문자열에 매칭되는 정규식이다.

치환(Replace) 구문: - \u$1\u$2\u$3

이제 치환 구문을 살펴보자.
- \u$1\u$2\u$3는 다음과 같은 변환을 수행한다.

  • - : 대시 뒤에 공백을 그대로 둠
  • \u$1: $1로 캡처했던 첫 번째 단어의 첫 글자를 대문자로 만든다(나머지는 그대로 유지).
  • \u$2: $2로 캡처했던 두 번째 단어 역시 첫 글자를 대문자로 변환한다.
  • \u$3: $3으로 캡처했던 세 번째 단어도 첫 글자를 대문자로 변환한다.

결과적으로 “- foo bar baz”가 “- FooBarBaz”로 바뀌는 식이다.
VS Code에서는 정규식 치환에서 \u나 \l 등을 사용하여 대소문자를 변환할 수 있다.

  • \u: 뒤이어 오는 캡처 그룹의 첫 글자를 대문자로 변환
  • \l: 뒤이어 오는 캡처 그룹의 첫 글자를 소문자로 변환

이를 적절히 활용하면 코드 내에서 변수명이나 함수명을 자동으로 일괄 변환하는 등 생산성을 크게 높일 수 있다.

VS Code에서 정규식 치환 적용 방법

  1. 검색 및 치환 창 열기

    • Ctrl + Shift + F(Windows/Linux) 또는 Cmd + Shift + F(Mac)을 통해 전체 프로젝트 내 검색/치환을 수행하거나,
    • 현재 파일 내에서만 검색/치환하고 싶다면 Ctrl + F(Windows/Linux) 또는 Cmd + F(Mac)을 누른 뒤, Replace 항목으로 전환한다.

  2. 정규식 모드 활성화

    • 검색창 왼쪽에 있는 .* 아이콘을 클릭해 정규식 모드를 켠다.

  3. 검색(Find)에 정규식 입력

    • 예시에서는 ^- ([a-zA-Z]+)\s([a-zA-Z]+)\s([a-zA-Z]+)$를 입력한다.

  4. 치환(Replace)에 변환 구문 입력

    • 예시에서는 - \u$1\u$2\u$3를 입력한다.

  5. 결과 확인 및 치환

    • 검색 결과 리스트나 에디터 내 하이라이트를 보고, 문제가 없으면 Replace 또는 Replace All 버튼을 눌러서 일괄 변환한다.

마무리

VS Code는 강력한 정규식 검색 및 치환 기능을 제공함으로써 코드나 문서를 간편하게 수정할 수 있는 환경을 마련해 준다. 특히 캡처 그룹과 대소문자 변환 옵션을 적절히 사용하면, 번거로운 수작업을 최소화하고 일관된 코드 스타일을 유지하는 데 큰 도움이 된다. 앞으로 VS Code에서 정규식을 좀 더 폭넓게 활용해 보고 싶다면, 공식 문서나 정규식 테스트 사이트 등을 참고해 다양한 패턴을 시도해 보는 것도 좋겠다.

이상으로 VS Code에서 정규식을 활용하여 텍스트를 효율적으로 찾아내고 치환하는 방법에 대해 간단히 살펴보았다. 정규식에 조금만 익숙해지면 생산성이 크게 높아지므로, 이를 적극 활용하여 편리한 개발 환경을 구축해 보도록 하자. 이상으로 글을 마치도록 하겠다. 모두에게 도움이 되었으면 하는 바람이다.