oh my posh 설치 법

Blackeichi·2023년 3월 30일
0

출처

https://ddochea.tistory.com/190

밋밋하기만 한 파워셸을 한층 예쁘게 꾸며주는 Oh My Posh 를 설치해보았다. 설치방법은 공식 사이트에 설명되어있으나 그대로 수행하면 VSCode에선 오류가 나는등의 이슈가 있어 간략하게 재 정리하였다.
정리한 내용은 Windows 11 Host 환경(WSL 아님)을 기준으로 작성했다.

  1. Oh My Posh 설치
    Oh My Posh를 설치한다. 공식사이트에서 처럼 winget, chololatey 명령어를 이용하면 된다. 개인적으로 winget을 추천한다.
winget install JanDeDobbeleer.OhMyPosh
  1. 테마파일 생성 및 적용
    .mytheme.omp.json 파일을 생성한다. 필자는 $HOME 경로에 생성했다. 자신의 $HOME 경로가 궁금하다면 powershell에서 echo $HOME 를 입력하면 된다.

아래 파일은 Oh My Posh 테마 중 1개인 M365Princess 테마이다.

{
  "$schema": "https://raw.githubusercontent.com/JanDeDobbeleer/oh-my-posh/main/themes/schema.json",
  "final_space": true,
  "blocks": [
    {
      "type": "prompt",
      "alignment": "left",
      "segments": [
        {
          "type": "session",
          "style": "diamond",
          "foreground": "#ffffff",
          "background": "#9A348E",
          "leading_diamond": "\uE0B6",
          "trailing_diamond": "",
          "properties": {
            "prefix": "",
            "template": "{{ .UserName }}"
          }
        },
        {
          "type": "path",
          "style": "powerline",
          "powerline_symbol": "\uE0B0",
          "foreground": "#ffffff",
          "background": "#DA627D",
          "properties": {
            "style": "folder"
          }
        },
        {
          "type": "git",
          "style": "powerline",
          "powerline_symbol": "\uE0B0",
          "foreground": "#ffffff",
          "background": "#FCA17D",
          "properties": {
            "fetch_stash_count": true,
            "fetch_upstream_icon": true,
            "branch_icon": "",
            "fetch_status": false,
            "template": "{{ .UpstreamIcon }}{{ .HEAD }}{{ if gt .StashCount 0 }} \uF692 {{ .StashCount }}{{ end }}",
            "prefix": " \u279C (",
            "postfix": ") "
          }
        },
        {
          "type": "node",
          "style": "powerline",
          "powerline_symbol": "\uE0B0",
          "foreground": "#ffffff",
          "background": "#86BBD8",
          "properties": {
            "prefix": " \uE718 "
          }
        },
        {
          "type": "time",
          "style": "diamond",
          "trailing_diamond": "\uE0B0",
          "foreground": "#ffffff",
          "background": "#33658A",
          "properties": {
            "prefix": " \u2665 ",
            "time_format": "15:04"
          }
        }
      ]
    }
  ]
}
  1. 테마적용
    테마파일을 생성했다면 해당 테마를 적용해줄 차례이다. shell 에서 아래 명령어로 Powerhsell 프로필파일을 열어준다. 공식사이트에선 notepad를 이용했는데, 필자는 VSCode를 설치했으므로, code를 이용하겠다.
code $PROFILE

파일이 열렸다면 아래와 같이 코드를 추가해주자.

$Env:Path += ";C:\Users\ddochea\AppData\Local\Programs\oh-my-posh\bin" # oh-my-posh가 설치된 경로. vscode 용도. 설치 과정에서 추가가 안될때 사용
oh-my-posh --init --shell pwsh --config $HOME/.mytheme.omp.json | Invoke-Expression
그 뒤 새로운 터미널을 열어 파워셸을 실행하면, 대부분 처음 설치하는 사람들은 아래와 같이 글자가 깨진 것처럼 나오게 될 것이다.

이 문제를 해결하기 위해선 폰트를 설치해야 한다.
https://www.nerdfonts.com/

  1. 폰트 설치
    Nert Fonts 에서 다운로드 받은 zip 파일을 압축해제 한 후, [설정] -> [개인설정] -> [글꼴] 에서 압축 해제한 .ttf 파일들을 "설치하려면 끌어서 놓기" 에 드래그 앤 드롭(Drag & Drop) 한다.
  1. Windows 터미널에 폰트 적용
    터미널 설정에서 [프로필]->[기본값]->[모양]을 선택한 후, 설치한 글꼴을 찾아 설정한다.

설치가 완료되면 깨짐이 해결된다.

  1. VSCode에 폰트 적용
    VSCode 하단에 설정버튼을 누른 후, font를 검색하여 설치한 Nerd Font를 추가 입력해주면 된다.
  • 상세 설정에 따라 터미널폰트만 따로 설정되어 있는 사용자의 경우는 Edit in Settings.json 을 눌러 확인 후 편집해야 한다.

설정이 되면 VSCode에서도 터미널과 동일한 적용상태를 확인할 수 있다.

profile
프론트엔드 주니어 개발자 한정우입니다. 😁

0개의 댓글