VS Code 터미널에서 Fish shell 설치 및 테마 설정, 아이콘 깨짐 해결

  1. 폰트설치

    VS Code 종료 후 windows에 폰트를 다운 받아 설치한다.

    MesloLGS NF Regular.ttf

    MesloLGS NF Bold.ttf

    MesloLGS NF Italic.ttf

    MesloLGS NF Bold Italic  

2. VS Code 터미널 폰트 변경

   GitHub - romkatv/powerlevel10k: A Zsh theme 참고.

   설정->사용자>기능->터미널->Integrated: Font Family->MesloLGS NF 로 설정

   설정 후 고정폭 글꼴이 아니라는 안내창 나오면 해당 창 닫고 VS Code restart

   

3. fish shell 설치 fish shell

   $ sudo apt-add-repository ppa:fish-shell/release-3

   $ sudo apt update

   $ sudo apt install fish

4. fish 테마, 플러그인 매니저 설치

   여기선 Fisher를 사용한다. GitHub - jorgebucaran/fisher: A plugin manager for Fish.

   $ fish => 먼저 fish 쉘 실행

   $ curl -sL https://raw.githubusercontent.com/jorgebucaran/fisher/main/functions/fisher.fish | source && fisher install jorgebucaran/fisher

5. prompt manager 설치. 테마이다. 이쁘게 쉘 꾸며주는.

   GitHub - IlanCosman/tide: 🌊 The ultimate Fish prompt.

   여기선 Tide 설치. 마찬가지로 fish 쉘에서 설치해야한다.

   $ fisher install IlanCosman/tide@v5

  설치된 후 바로 원하는 모양으로 선택하는 화면이 나온다. 본인의 입맞에 맞게 선택 후

  마지막에 Y 

6. 설치 및 셋팅 완료 후 쉘이 위 이미지처럼 나오면 OK. 아이콘이 깨져나오면 폰트 설치 및

   셋팅을 다시 확인해 본다.

 

VS code Extensions

Lintting이나 Intellisense는 Extension 기능들 중 중복되는 부분이 있어서 각 Extension 설정에서 조정해줘야한다.

Beautify

Auto Close Tag


Debugger for Chrome

EditorConfig for VS Code

ESLint

HTML CSS Support

HTML Snippets

JavaScript (ES6) code snippets

jQuery Code Snippets

json

Korean Language Pack for Visual Studio Code

Live Server

npm Intellisense

Prettier - Code formatter

Quokka.js

Remote - WSL

SFTP

TabNine (VS Code 용 codota-AI Code Completions for your IDE)

Vetur

Visual Studio IntelliCode

vscode-icons

Node 나 VUE 쪽은 더 추가해야 함.