如何用Vim搭建IDE？

推薦：http://harttle.com/2015/07/18/vim-cpp.html

轉自：http://harttle.com/2015/11/04/vim-ide.html

一年前我從Vim切換到了WebStorm，是由於WebStorm強大的重構功能，以及Super Search功能。涉及多文件編輯和重構時WebStorm的優點便很是明顯。

最近到手了HHKB，從鍵盤到觸摸板的切換仍是挺麻煩的，因而Vim編輯的需求又來了。。加之WebStorm常常假死，我決定從新啓用Vim。同時從新打造了個人Vim，使它可以知足我在IDE中的全部需求。這篇文章便來記述整個過程，或許有些幫助。先上圖：

上圖中，下面的Console是經過Tmux搞的。Tmux的配置和使用參見：優雅地使用命令行：Tmux終端複用。

準備工做

安裝Git、Homebrew（若是你是Mac），並安裝新版本的Vim(>=7.3)。通常linux發行版都會預裝Vim，你須要檢查一下vim的版本：

$ vim --version VIM - Vi IMproved 7.4 (2013 Aug 10, compiled Jul 4 2015 01:13:13) MacOS X (unix) version Included patches: 1-712 Compiled by Homebrew 

若是上述命令失敗，那麼你須要安裝一個Vim~ 這裏提供了Vim的基本快捷鍵備忘錄。

OSX

$ brew update $ brew install vim 

Linux

apt-get install vim   # ubuntu pacman -S vim # archlinux yum install vim # centos 

Vundle

Vundle是基於Git的vim插件管理工具，是目前最推薦的工具。以前個人.vim下手動維護着各類插件，目錄結構看起來是這樣的：

|- doc/
|  |- emmet.txt
|  |- NERDCommenter.txt
|  |- ...
|- plugin/
|  |- emmet.vim
|  |- NERDCommenter.vim
|  |- ...
|- autoload/
|  |- emmet.vim
|  |- NERDCommenter.vim
|  |- ...
|- ftplugin/

使用Vundle後變成了這樣：

|- bundle/
|  |- emmet/
|  |  |- doc/
|  |  |- autoload/
|  |- NERDCommenter/
|  |  |- doc/
|  |  |- autoload/
|- ftplugin/

其中ftplugin裏面是個人配置，好比編譯運行的快捷鍵等。另外，若是你在用Git同步Vim配置的話，能夠把bundle/加入.gitignore。

那麼怎麼安裝Vundle呢？

git clone https://github.com/gmarik/Vundle.vim.git ~/.vim/bundle/Vundle.vim

而後在你的.vimrc中加入Vundle的配置：

set nocompatible " required filetype off " required set rtp+=~/.vim/bundle/Vundle.vim call vundle#begin() Plugin 'gmarik/Vundle.vim' call vundle#end() " required filetype plugin indent on " required 

而後在vim中運行:PluginInstall便可（或者在Bash中運行vim +PluginInstall）。之後只須要在添加一行Plugin 'xxx'並運行:PluginInstall便可自動安裝插件。

窗格管理

要把Vim打形成一個IDE，你須要熟悉Vim如何建立窗格，以及如何在窗格間切換。 :sp能夠水平分割當前窗格，:vs能夠垂直分割當前窗格。能夠重複屢次，建立複雜的窗格佈局：

C-w, C-w能夠切換到下一窗格，C-w, j切換到下面的窗格，C-w, k切換到上面的窗格，C-w, h切換到左邊的窗格，C-w, l切換到右邊的窗格。 我爲這些操做設置了更加方便的快捷鍵，好比Ctrl+J切換到下面的窗格：

nnoremap <C-J> <C-W><C-J> 

多文件管理可使用多窗格，也可使用Buffer的方式。好比vim a.js b.js就會在Buffer中同時打開兩個文件。使用:ls列出當前Buffer中的文件，而後使用數字鍵切換。也可使用:b 2切換到Buffer中的第二個文件。

摺疊

有些人特喜歡代碼摺疊，我就在這裏列一下如何優雅地摺疊代碼。首先在.vimrc中添加配置：

set foldmethod=indent au BufWinLeave * silent mkview " 保存文件的摺疊狀態 au BufRead * silent loadview " 恢復文件的摺疊狀態 nnoremap <space> za " 用空格來切換摺疊狀態 

開啓以indent來摺疊代碼後，打開一個文件會發現有縮進的內容全被摺疊起來了。因此咱們引入一個SimpleFold來更智能地摺疊：

Plugin 'tmhedberg/SimpylFold' 

不要忘了運行:PluginInstall。

自動補全

自動補全固然是用YCM：

Plugin 'Valloric/YouCompleteMe' 

而後進行配置就行了，YCM是經過Vim的omnifunc機制來自動補全的，因此你須要爲你想要支持的語言安裝一個提供omnifunc接口的Vim插件。

我在另外一篇博客中有詳細介紹了自動補全、語法檢查等配置。

項目樹

這想必是IDE能提供的最大的好處之一，在Vim中可使用NERDTree來顯示文件樹，它的快捷鍵很是多，因此和Vim同樣的越用越爽。

Plugin 'scrooloose/nerdtree' " 這個插件能夠顯示文件的Git增刪狀態 Plugin 'Xuyuanp/nerdtree-git-plugin' 

這裏給出個人一些NERDTree配置：

" Ctrl+N 打開/關閉 map <C-n> :NERDTreeToggle<CR> " 當不帶參數打開Vim時自動加載項目樹 autocmd StdinReadPre * let s:std_in=1 autocmd VimEnter * if argc() == 0 && !exists("s:std_in") | NERDTree | endif " 當全部文件關閉時關閉項目樹窗格 autocmd bufenter * if (winnr("$") == 1 && exists("b:NERDTreeType") && b:NERDTreeType == "primary") | q | endif " 不顯示這些文件 let NERDTreeIgnore=['\.pyc$', '\~$', 'node_modules'] "ignore files in NERDTree " 不顯示項目樹上額外的信息，例如幫助、提示什麼的 let NERDTreeMinimalUI=1 

全局搜索

WebStrom的全局搜索是我當初使用它的主要緣由；而如今全局搜索老是忽然崩潰，也是我放棄WebStorm而轉到Vim的主要緣由。

成也蕭何敗蕭何

安裝ctrlp：

Plugin 'kien/ctrlp.vim' 

而後按下C-P，即可以全局搜索啦。使用C-j, C-k上下翻頁，<Enter>打開選中文件。一樣，給出一些有用的配置：

let g:ctrlp_working_path_mode = 'ra' set wildignore+=*/tmp/*,*/node_modules/*,*.so,*.swp,*.zip let g:ctrlp_custom_ignore = {'dir': '\v[\/]\.(git|hg|svn)$', 'file': '\v\.(exe|so|dll)$'} 

剪切板

剪切板想必是全部Vim用戶的痛。可是！在Mac下只須要設置：

set clipboard=unnamed 

你在Vim中copy的全部內容都會上系統剪切板。在Vim中拷貝內容時，能夠切換到拷貝模式防止自動縮進和補全。 個人快捷鍵是<F9>：

set pastetoggle=<F9> 

狀態欄

有沒有注意到我酷炫的狀態欄？安裝一個powerline：

Plugin 'Lokaltog/powerline', {'rtp': 'powerline/bindings/vim/'} 

此外，爲了正確顯示Powerline的圖標，還須要一些設置：

set guifont=Inconsolata\ for\ Powerline:h15 let g:Powerline_symbols = 'fancy' set encoding=utf-8 set t_Co=256 set fillchars+=stl:\ ,stlnc:\ set term=xterm-256color set termencoding=utf-8 

而後在系統字體庫中導入powerline font，若是是Mac的話可使用Font Book來導入。 而後須要設置terminal（iTerm）的non-ASCII字體爲PowerlineSymboles：

註釋、反註釋

NERDCommenter是個不錯的工具，支持很是多的語言：

Plugin 'scrooloose/nerdcommenter' " commenter: \cc \cu 

而後按下\cc來註釋當前航，\cu來反註釋，\c<space>來切換註釋。其中的\\是能夠設置的：

let mapleader=';' 

Loremipsum

哈哈若是你沒見過標題中的這個詞就能夠跳過了。前端開發中一般須要添加一些佔位符來讓頁面看起來有內容又像人話，loremipsum（拉丁語）一般就是這些佔位符的起始字符。好比下面一段：

Sodales eget, leo. Sed ligula augue, cursus et, posuere non, mollis sit
amet, est. Mauris massa. Proin hendrerit massa. Phasellus eu purus. Donec est
neque, dignissim a, eleifend vitae, lobortis ut.

安裝一個loremipsum便可：

Plugin 'vim-scripts/loremipsum' 

我還加了點設置來方便控制長度：

inoremap Lorem <Esc><Esc>:Loremipsum 20<CR> inoremap Ipsum <Esc><Esc>:Loremipsum 70<CR> 

這樣，當輸入Lorem時產生長度爲20單詞的佔位符，輸入Ipsum時產生長度爲70的佔位符。

參考連接：

• https://realpython.com/blog/python/vim-and-python-a-match-made-in-heaven/
• https://coderwall.com/p/yiot4q/setup-vim-powerline-and-iterm2-on-mac-os-x