Vim as IDE

I’ve being working part time in server ops for many years and one thing in common to every server is the editor – Vim is always available. But I never learned too much about it, enough to open a file, make changes and save it. I slowly picked up a few tricks, but really, for 20 years, I didn’t go much beyond basic editing stuff.

On my desktop, I have a wide selection of editors. Which for day to day use I had narrowed down to three: Sublime for PHP/Python, Visual Code for Javascript/Typescript and Vim for system files. (I do have Atom and Brackets installed, but never use them). So, one day I thought, why not just use one editor? And why not have that one editor be Vim configured as an IDE? It’s fast and ridiculously configurable. So, here is the setup I use…

OK, first, let me clear one thing, I’ve actually ended up using Neovim, which is mostly compatible with standard Vim, so most of what I write here will work out fine if you have bog standard Vim.

In my most humble opinion, there are a few things which any IDE needs to handle for me: work with groups of files as Projects, provide a way to navigate easily between the files in a project, have advanced, intelligent syntax highlighting, format the code correctly, be able to autocomplete for the language being used.

Key mappings

But to start with, whether I’m using Vim as an IDE or a plain old editor, there are some things to setup with the keystrokes that Vim uses. Some are just plain awkward. Fortunately, this being Vim, everything is customisable.

First, Esc is a pain to reach, so I remap that one to jk or kj. Also I have a muscle memory to save files with Ctrl-S so that is an easy mapping. And switching buffers… well, I can work with :bn and bp but it’s clumsy. I find <C-[> and <C-]> so much simpler.

So, this is an excerpt from my .vimrc file:

" switch to next/previous buffer
nmap <C-[> :bp<CR>
imap <Esc><C-[> :bp<CR>
nmap <C-]> :bn<CR>
imap <Esc><C-]> :bn<CR>

" Ctrl-S to save the file
nmap <C-s> :w<CR>
imap <C-s> <Esc>:w<CR>a

" switch to command mode easily (like <ESC>)
inoremap jk <ESC>
inoremap kj <ESC>

I have some other tweaks in the file, but those are the main ones. On the whole I prefer to learn the native Vim keystrokes.

If you want to dive deeper, then Vim Wikia has all you need to know.

Plugins

So, most of the functionality that we need is contained within various plugins. There are, literally, thousands of plugins for Vim (vim.org lists 5,532) and there are others on github (78,000 mentions of vim, not plugins though).

And, of course, there are plugin managers. I use Vundle, but there are others such as Pathogen or Vim-Plug. Plugins are generally stored in .vim/bundle and then loaded through the .vimrc file.

Syntax highlighting and pretty colors

Let’s look at the important stuff first – the pretty shiny bits. Syntax highlighting, themes and colour schemes come together really but can easily be interchanged.

I use a theme called Gruvbox but there are plenty of others to choose from. I can also recommend the highly regarded Solarized scheme. Schemes can be ‘dark’ or ‘light’ and can be switched while editing with set background=light (or ‘dark’). In fact, here is a fun tip, type :colorscheme and a space, then Tab, you will see a list of installed colorschemes to choose from. Try VimColors for inspiration.

I use devicons to provide nice file icons in the NERDTree window (see below) and Vim Airline and themes for the status bar at the bottom. Airline is Vim Status line for the bottom of the editor pane.

Plugin 'morhetz/gruvbox'
Plugin 'ryanoasis/vim-devicons'
Plugin 'vim-airline/vim-airline'
Plugin 'vim-airline/vim-airline-themes'

There are two general purpose syntax plugins that I use: Syntastic and Polyglot. The polyglot pages have a long list of plugins that can be added for the actual language dependent syntax highlighting.

Project handling

I view project handling as the ability to navigate around a group of files that form a particular project and to save the state of the files to be restored. In Vim, this breaks down to a Navigator pane, a way of saving sessions and a means of handling buffers.

Navigation, I work best with a tree panel on the left, and NERDTree provides this capability. There are plugins to flag git status and other things. I like NERDTree to open automatically only if I don’t specify a file on startup.

" To have NERDTree always open on startup
let g:nerdtree_tabs_open_on_console_startup = 0
" open NERDTree automatically on start up if no files were specified
autocmd StdinReadPre * let s:std_in=1
autocmd VimEnter * if argc() == 0 && !exists("s:std_in") | NERDTree | endif

Another useful file navigation plugin is CtrlP which allows fuzzy search of files in the project tree. It’s important to skip some files though so this is the config I use:

" ----- ctrlp settings -----
let g:ctrlp_working_path_mode = 'ra'
" let g:ctrlp_custom_ignore = { 'dir':['node_modules','no-upload','no-uploads'] }
" let g:ctrlp_custom_ignore = ['node_modules','no-upload','no-uploads']
set wildignore+=*/node_modules/*,*/no-upload/*,*/no-uploads/*

CtrlP is immensely powerful, check out the documentation to get the full scope.

EditorConfig-vim is an EditorConfig plugin.

BTW, if you have some confusion about the relationship between ‘windows’, ‘tabs’, ‘buffers’ etc, then this StackOverflow article has some good explanations and ideas.

As part of project navigation, getting around the buffers is important and can be a bit clutzy in Vim. Normally we would use :bn or :bp to switch buffers, but BufExplorer provides some simple methods for listing and switching buffers.

Other useful plugins

For working with Markdown files, I use vim-markdown and the associated godlygeek/tabular. This is my configuration:

" ------ plasticboy/vim-markdown settings -----
let g:vim_markdown_frontmatter = 1
let g:vim_markdown_folding_disabled = 1

For workspace management, I use vim-workspace. Vim does have a built-in way of saving and restoring sessions but this plugin simplifies matters greatly and allows for automatically saving sessions. I have had trouble with using it and NERDTree, so that is something I’m still working on.

Conclusion

Vim/Neovim are perfectly usable as text editors and as a complete IDE. It takes work to get it setup and to explore all the various plugins that can be used. In general, it is worth checking how recently the various plugins have been updated and if it has been a few years, search for a newer one.