Vim Configuration 정리

2019-07-14 20:31:10

개발을 할때 에디터로 주로 Vim을 사용한다. 상황에 따라 Visual Studio Code 혹은 WebStorm과 같은 IDE에 Vim Plugin을 올려서 사용하거나 터미널 기반으로만 사용하기도 했다. 최근엔 WebStorm과 같이 사용하다가 무겁다는 느낌을 많이 받아서 터미널 기반으로 다시 설정하고 설정한 내용들을 정리해보려고 한다.

Neovim

언제부턴가 기본 vim보다는 neovim을 설치해서 사용하고 있다. neovim을 설치해서 쓰는 이유는 vim보다 많은 color를 지원하고 성능면에서도 많이 발전했다고 한다. 설정이나 사용면에 있어서 vim에서 크게 벗어나지 않아 vim을 사용했다면 neovim으로 넘어가는데 문제는 없을 것 같다.

먼저 Neovim과 theme, icon에서 사용될 font를 설치해준다.

1
2
3

brew install neovim
brew tap caskroom/fonts
brew cask install font-hack-nerd-font

설치가 완료되었다면 vi, vim 대신 neovim을 실행하도록 설정을 추가한다.
(사용하는 shell 에따라, ~/.zshrc, ~/.bashrc)

alias vim="nvim"
alias vi="nvim"
alias vimdiff="nvim -d"
export EDITOR=/usr/local/bin/nvim

추가했다면 source 명령을 통해 적용해준다.

이제 ~/.config/nvim/init.vim 에서 neovim에 대한 설정을 할 수 있다.

Vim Plugin 설정

Vim은 플러그인 매니저로 Vim Plug, Bundle과 같은 도구를 이용한다.
요즘은 Bundle보다는 Plug를 많이 사용하는 것 같아 Plug를 선택했다.

Vim Plug 설치는 Plug Github을 참고해서 설치하도록 한다.

Plugin 설치 방법

neovim 설정 파일을 연다. (~/.config/nvim/init.vim)

call plug#begin()

"" Plugin List
Plug 'junegunn/fzf'

call plug#end()

위와 같이 plugin 설정에 대한 시작과 끝을 표시하고 중간에 설치할 Plugin List를 작성하는 형식이다.
필요한 플러그인에 대해 검색해보고 github repository를 찾아서 owner와 repository name을 아래와 같은 형식으로 적어주면 된다.
Plug '<owner>/<repository_name>'

이렇게 설정파일을 만들고나서 vi command 모드에서 :PlugInstall 을 해주면 차례대로 Plugin이 설치되는 것을 볼 수 있다.

clean, upgrade와 같은 추가적인 명령에 대해서는 Plug Github을 참고도하도록 하자.

유용한 Vim Plugin들

개발언어나 개발환경에 따라 사용하는 플러그인이 많이 다르겠지만 공통적으로 유용하게 사용하는 Plugin에 대해 소개해보려고 한다.

NERD Tree

vim 에서 파일 탐색기를 지원해주는 플러그인이다. IDE까지는 아니더라도 비슷하게 흉내내서 사용할 수 있다.
또한 이 Plugin은 vim 에서 사용하는 키를 그대로 사용해서 컨트롤 할 수 있어서 정말 편리하다.
마우스를 사용하지 않고 파일을 컨트롤 할 수 있는게 큰 장점이다.

설치하는 방법은 플러그인 마다 다르지 않기 떄문에 위 설치 방법을 참고하면 된다.
scrooloose/nerdtree

추가적인 설정

"" Dir Arrow 설정
let g:NERDTreeDirArrowExpandable = '▸'
let g:NERDTreeDirArrowCollapsible = '▾'

"" 숨김파일 보이도록 처리
let NERDTreeShowHidden=1

숨김파일에 대한 설정을 해주지 않으면 .gitignore, .env와 같은 파일들이 보이지 않아 불편하다.

NERDtree Git Plugin

NERDTree 상에서 Git에 대한 변경내용을 표시해준다.
이것도 바뀐파일을 확인할때 유용하므로 꼭 설치해두자.
Xuyuanp/nerdtree-git-plugin_

Vim dev-icons

여러 vim 플러그인에서 개발관련 icon을 사용할 수 있게 해주는 plugin이다.
NERDTree에서도 Icon을 표시해줘서 파일확장자를 보지 않아도 쉽게 구분할 수 있다.
아이콘이 깨지지 않고 표시되려면 위에 있는 폰트를 반드시 설치해줘야 한다.
ryanoasis/vim-devicons

Vim airline

vim 상태바를 이쁘게 만들어준다.
상태바에는 vim 모드, git branch, 파일 인코딩 과 같은 정보가 들어가게 된다.
다른 플러그인과 연동도 잘되고 가장 많이 쓰이는 플러그인 중 하나이다.
vim-airline/vim-airline

Vim fugitive

vim에서 git을 사용할때 유용한 plugin이다.
git cli 에서 제공하는 기능을 대부분 사용할 수 있으며 cli를 사용하는 것 보다 매우 편리하다.
vimcast에서 자세한 사용방법에 대해 설명해준다.
tpope/vim-fugitive

ctrlp

대부분에 IDE에서는 특정 단축키를 통해서 특정파일을 검색하고 이동하는 기능을 제공한다.
ctrlp 플러그인은 vim 에서 이와 같은 작업을 할 수 있도록 도와준다.
플러그인 이름과 같이 ctrl+p를 누르면 파일을 검색하고 이동할 수 있다.
ctrlpvim/ctrlp.vim

ale

ale는 vim에서 lint, syntax check를 위한 플러그인이다.
다른 플러그인도 여러개있지만 성능면에서 ale가 우수하다고 한다.
eslint, prettier와 같은 툴과도 같이 사용할 수 있다.

실제 개발을 위해선 위에서 소개한 플러그인 말고도 여러가지를 더 설치해야 한다.

현재 Vim Configuration

아래 내용은 내가 셋탱해놓은 Vim configuration 이다.
한번 지우고 필요한 것만 다시 설치하느라 빠뜨린게 많을 수 있다.

개발화면

위 화면에서는 vim과 tmux를 함께 사용하는 화면이다.
tmux 에 관련해서는 tmux 포스팅을 참고하도록 하자.

마치며

IDE에 Vim Plugin을 올려서 사용하는 것과 terminal 상에서 vim을 customize해서 사용하는 것 모두 장단점이 존재한다. vim 설정을 공부하고 일일이 plugin을 설치하는 것은 매우 귀찮고 시간도 많이 들어가는 작업임이 분명하다. 하지만 한 번 설정해놓으면 IDE보다 가볍게 사용할 수 있고 거이 모든 작업을 키보드로 할 수 있다. IDE가 무겁거나 한 번쯤 새로운 환경을 만들어 보고 싶다면 시도해볼만 한 것 같다.

Ref

vim tool

hosung

🔥 Typescript