vim-deviconsで格好いいvimを作ろう。

TL;DR

• 格好いいvim使いの決定版 vim-devicons を紹介
• vim-deviconsのスクリーンショット

Nerd Fontをインストール

vim-deviconsはNerd Fontを使う。
使えるFontがないと文字化けになるので、先にインストールしなければならない。

Fontのインストール方法は多数存在する。
詳細が知りたい場合は、次のページを参照しよう。

• https://github.com/ryanoasis/nerd-fonts#font-installation

ここでは４と6の方法を使う。どちらか一つだけを選んでFontをインストールしても構わない。
使えるFontの数と種類に少し違いがあるだけだ。

• Options 4: Homebrew Fonts

  brew tap homebrew/cask-fonts
  brew cask install font-hack-nerd-font
  

• Options 6: Ad Hoc Curl Download

  Linux

  mkdir -p ~/.local/share/fonts
  cd ~/.local/share/fonts && curl -fLo "Droid Sans Mono for Powerline Nerd Font Complete.otf" https://github.com/ryanoasis/nerd-fonts/raw/master/patched-fonts/DroidSansMono/complete/Droid%20Sans%20Mono%20Nerd%20Font%20Complete.otf
  

  macOS

  cd ~/Library/Fonts && curl -fLo "Droid Sans Mono for Powerline Nerd Font Complete.otf" https://github.com/ryanoasis/nerd-fonts/raw/master/patched-fonts/DroidSansMono/complete/Droid%20Sans%20Mono%20Nerd%20Font%20Complete.otf
  

コマンドをそのままコピペして実行すればFontのインストールが完了する。

TerminalのFont設定

Fontをインストールしたら、使っているterminalにも適用しなければならない。
文字化けになる。

macOSのterminal

iTerm2の場合は、FontとNon-ASCII Fontの２種類で設定ができるが、macOSデフォルトのterminalはフォントの設定が一か所しかない。
Options 6の方法でFontをインストールした場合は、Droid Sans Nerd Font CompleteというFontが使える。
そのFontで指定して設定しよう。

iTerm2

iTerm2ではFontとNon-ASCII Fontを分けて設定ができる。
Fontでは文字の可読性が優れるRicty for Powerlineを設定して、Non-ASCII FontではDroid Sans Nerd Font Completeを設定する。

Ricty for Powerlineについてはこの記事を参照しよう。

vim-deviconsのインストール

• vimrcにplugin追加

  Plug 'ryanoasis/vim-devicons'
  

• 追加したpluginをインストール

  :so ~/.vimrc
  :PlugInstall
  

• vimrcのおすすめ設定

  " guifontを設定しないと文字化けになる。terminalで行ったフォントの設定と同様
  " 公式サイトではLinuxとmacOSの設定が若干異なるが、Linuxの設定でもmacOSで問題なし
  set guifont=Droid\ Sans\ Mono\ for\ Powerline\ Nerd\ Font\ Complete\ 12
  set encoding=utf-8
  
  " フォルダアイコンを表示
  let g:WebDevIconsNerdTreeBeforeGlyphPadding = ""
  let g:WebDevIconsUnicodeDecorateFolderNodes = v:true
  " after a re-source, fix syntax matching issues (concealing brackets):
  if exists('g:loaded_webdevicons')
    call webdevicons#refresh()
  endif