Visual Studio Code 터미널에서 oh-my-zsh 프롬프트 폰트 문제 해결

최근 MacOS 의 운영체제는 zsh를 기본으로 하고 있다. 개발자들은 zsh을 좀 더 잘 사용하기 위해서 oh-my-zsh 을 설치하여 사용하고 있다. oh-my-zsh 를 설치후 Visual Studio Code의 터미널을 열게되면 터미널에서 사용하는 아이콘들이 깨어져 보이는데 이 문제를 해결하기 위한 내용을 소개한다.

Visual Studio Code 터미널에서 oh-my-zsh 프롬프트 폰트 문제 해결

최근 MacOS는 zsh을 기본으로 하고 있다. 많은 개발자들은 zsh을 좀 더 잘 사용하기 위해서 oh-my-zsh을 설치해서 사용하고 있다. 아래 스크린샷은 개발연구용으로 사용하고 있는 MacBook 에 iTerm + Oceanic Next + oh-my-zsh 의 조합의 모습이다.

oh-my-zsh 은 많은 plugins 을 제공하고 있는데 기본적으로 git 플러그인이 설치가 되어 있다. 이 때 git 의 상태를 터미널의 prompt 에 아이콘으로 표시를 해주기 때문에 터미널에서 코드의 상태를 쉽게 확인할 수 있는 장점이 있다.

다만 이 때 아이콘을 표현해주는 font 가 반드시 설치가 되어 있고 터미널에 적용을 해줘야한다. 개인적으로 Monaco 폰트를 가장 좋아한다. 아마도 Mac 에서 기본적으로 코드를 볼 때 오래전부터 사용해왔던 폰트라서 그런것 같다. 지금은 Menlo 폰트가 기본으로 설치되어 사용되고 있는데 나는 MacOS 를 처음 세팅할 때 처음부터 폰트를 Monaco 로 변경해서 사용하고 있다.

oh-my-zsh에서 사용하는 아이콘을 기본적으로 Monaco 에서 지원하고 있지 않기 때문에 prompt가 깨어져 보이는 문제가 있다. 이 문제는 Visual Studio Code 의 터미널을 사용할 때도 같은 문제가 나타난다. 위 iTerm 에 사용해서 보이던 아이콘이 아래 스크린샷과 같이  VSCode 의 터미널에서 깨어져 보이는 것을 확인할 수 있다.

Powerline을 사용하면 이런 폰트문제를 해결할 수 있다.  MacOS에 기본적으로 설치되어 있는 Monaco 폰트는 아이콘 지원을 하지 않기 때문에 Powerline 을 패치한 Monaco 폰트를 다운로드 후 설치한다. 다운로드 링크는 Powerline 패치한 Monaco 폰트 파일을 포크한 링크에서 다운 받으면 된다.

Powerline-patched Monaco for Windows and OSX
Powerline-patched Monaco for Windows and OSX. GitHub Gist: instantly share code, notes, and snippets.

폰트 파일을 다운로드 후 더블클릭하면 자동으로 MacOS 의 Font Book 에 추가가 된다.

이제 VSCode 의 설정 파일에서 terminal font 라고 검색하면 터미널의 폰트를 적용할 수 있는 항목이 나온다. Terminal > Integrated: Font Family  항목에 Monaco for Powerline 을 입력하면 터미널에서 문제가 되던 아이콘을 정상적으로 표시할 수 있다.

참고