如何用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