前言
大家好，我是Kira。
作为一个vim使用者，入职了新公司，在换了工作电脑的情况下，得从零开始配置vim，在此做个记录，也分享给大家，一起踩坑Go！
Notice 本文不介绍vim的使用方法，仅记录vim相关配置(~/.vimrc)，参数值可根据自己需要调整。
常规配置
vim本身自带很多基础功能，我们先对部分基础功能做一个配置。
-
文件类型
vim包括很多vim插件需要根据不同文件类型采取不同操作，因此我们需要打开vim的文件类型支持，如下：
filetype on filetype plugin on filetype plugin indent on -
语法高亮
vim支持语法高亮（特殊文件/语言类型需要插件支持），如下：
syntax on -
缩进
vim可以对缩进参数进行配置，如下按序是tab键宽度（空格数）、自动缩进/符号移位长度（空格数），tab进制（即满几个空格转换成一个tab）、tab键是否拆分成空格、自动缩进、智能缩进：
set tabstop=2 set shiftwidth=2 set softtabstop=2 set expandtab set autoindent set smartindent -
折叠
vim提供折叠代码的功能，我们可以自己配置折叠方法、等级等参数：
set foldmethod=syntax set foldlevelstart=999 -
备份
vim可以选择对已有文件编辑保存时是否创建旧内容的备份（个人选择不创建）：
set nobackup如果选择启用旧内容备份，则还有其他相关参数可以配置：
-
后缀名：backupext
-
文件位置：backupdir
-
文件过滤： backupskip
-
-
背景色
vim由于运行在终端里，所以需要用户手动告知背景色是什么(dark/light)，由此vim会自动优化colorscheme的颜色显示：
set background=dark -
配色文件
vim可以自己编写配色方案，一般以xxx.vim存放在~/.vim/colors里：
colorscheme xxx -
map前缀
为防止与其他功能冲突，vim很多插件的快捷键会采用前缀+快捷命令唤起的模式。vim也提供了设置前缀的方法：
let g:mapleader = "," -
自动补全视图
vim自带自动补全功能，并且可以设置自动补全时的视图表现，包括是否展示预览窗口、是否展示预览Popup等：
set completeopt-=preview " set completeopt+=popup
插件
vim有各种各样丰富的插件，来满足不同开发者的不同需求。作为一个前端猴子，从之前的React开发到现在的Vue开发，我配置了很多前端开发可能用到的插件。
NERD Commenter
Nerd Commenter是一个注释插件，提供多种注释命令，配合语法分析器使用十分方便。
其配置和快捷键可以参考它的github主页。
我仅设置了注释符与内容之间的空格数，其它均采用默认值：
let g:NERDSpaceDelims = 1
The NERDTree
The NERDTree是一个文件系统浏览器。可以展示复杂的目录系统，可以从中打开文件浏览或者编辑。
提供的命令可以参考doc文档。
我这里主要配置了一些快捷键：
nnoremap <leader>to :NERDTree<CR>
nnoremap <leader>tc :NERDTreeClose<CR>
nnoremap <leader>tt :NERDTreeToggle<CR>
nnoremap <leader>tf :NERDTreeFind<CR>
nnoremap <leader>tfc :NERDTreeFocus<CR>
YouCompleteMe
YouCompleteMe本身是一个强力且聪明的vim自动补全工具。
吐槽 对React的补全，use居然不能补全出来useEffect，我真是一脸疑问。所以暂时放弃了YCM的使用，转而继续使用tsuquyomi+OmniComplete做代码补全。
tsuquyomi
tsuquyomi提供了ts的补全、跳转和语法检查等一系列功能，把你的vim变成一个ts IDE。
它有很多可自定义的配置，下面列举几个我自己用的配置项：
- 单引号import
let g:tsuquyomi_single_quote_import = 1
- 禁用快速fix
let g:tsuquyomi_disable_quickfix = 1
- 变量类型hint快捷键
autocmd FileType typescript nmap <buffer> <Leader>t : <C-u>echo tsuquyomi#hint()<CR>
吐槽 目前TsuImport命令（用来自动添加变量引入语句）在我的电脑上没有结果，期待作者解决。
ALE
ALE是一个异步的语法检查器，咱们可以把它当做LSP的客户端。
- 警示格式
我们可以对ALE的errors以及warnings的显示格式进行配置：
let g:ale_sign_error = "E"
let g:ale_sign_warning = "W"
let g:ale_echo_msg_error_str = "E"
let g:ale_echo_msg_warning_str = "W"
let g:ale_echo_msg_format = "[%linter%] %s"
- 语法检查时机
什么时候进行语法检查，也是可以由我们控制：
let g:ale_lint_on_text_changed = "never"
let g:ale_lint_on_insert_leave = 1
let g:ale_lint_on_enter = 1
- 语法检查工具
我们可以为不同的语言分别指定语法检查工具，比如：
let g:ale_linters = {
\ 'vue': ['eslint', 'vls'],
\ }
由于ale会运行当前文件类型所有可用的语法检查工具，因此我们配合ale_linters_explicit可以实现，对指定的文件类型只使用指定的linters：
let g:ale_linters_explicit = 1
- 禁用补全
由于我们使用了tsuquyomi进行ts及tsx补全，因此我们禁用ale的补全：
let g:ale_completion_enabled = 0
- 跳转错误/警告快捷键设置
配置一下查看下一个/第一个错误的快捷键：
nnoremap <leader>an <Plug>(ale_next_wrap)
nnoremap <leader>af <Plug>(ale_first)
当然了，我们可以根据自己的需要配置。
typescript-vim & vim-jsx-typescript
typescript-vim和vim-jsx-typescript是vim的typescript和tsx语法文件，可以配合用来做代码高亮以及折叠，主要配置项是配色方案。
将自定义的配色方案写在配色文件里，所有的语法segments定义都在对应插件的源码里，比如：
hi tsxCloseTag ctermfg=63
hi tsxTag ctermfg=63
...
vim-prettier
vim-prettier是常用的格式化插件prettier的vim版本。与vsc版本的一样，默认使用项目下的.prettierrc.js作为配置文件。
vim-prettier有一些有趣的配置：
- 保存时自动保存
let g:prettier#autoformat = 1
- 自动保存时，是否需要特定标志
let g:prettier#autoformat_require_pragma = 1
如果这个标志位设为1，则需要再在文件开头设置@prettier或者@format标志，才能在保存时自动格式化：
/** @format */
/** @prettier */
Notice 必须要这种格式的注释，用双斜杠注释是不生效的。猜测是因为prettier cli要求的，而vim-prettier没有写清楚。但是令我匪夷所思的是，git主页的gif示例中，作者是采用双斜杠注释的，但是自动格式化生效了。
vim-minimap
vim-minimap是vim右上角的小地图导航，功能比较单一，相对vsc上的小地图可以指示搜索项和错误项等，它只能指示代码位置，但是聊胜于无吧。
可以配置小地图配色：
let g:minimap_highlight = 'MatchParen'
写在最后
自己使用vim主要是因为这样双手可以尽可能少的离开键盘，这是让我非常爽的一件事。
吐槽 vue的生态相比我大React还是有些差距，插件数量和质量都不令人满意，比如ale + volar高版本在vim中竟然无法正确检测语法错误，让我不得不放弃在vim中配置vue的想法。
最后奉上我自己的vim配置供有需要的人参考（可能会根据需求不定期更新），包括~/.vimrc和vim配色方案：kira-vim-config。
