John Anderson wrote a great article on how to convert your VIM editor into a world-class eclipse-like IDE. The article was comprehensive and a joy to read. However, I work with the web often and I need VIM to recognize javascript, HTML and CSS.
I found another article today called “Turn VIM into a Powerful Javascript Editor”. This article also demonstrated portions of converting VIM to a Python editor. John Anderson had some really cool features like tab-completion and buffers that I really liked, so I decided to combine the best of both worlds.
Below is my .vimrc file which works beautifully. There are some plugins required to make this work and they are written in the comments of my .vimrc file.
" Required plugins:
" Plugins are place in the .vim/plugins directory
" Javascript.vim plugin from:
" git://github.com/pangloss/vim-javascript/git
" NERDTree.vim plugin from:
" https://github.com/scrooloose/nerdtree
" jsbeautify.vim plugin from:
" http://jsbeautifier.org/
" SuperTabCompletion plugin from:
" http://github.com/ervandew/supertab
" Minibufexpl.vim plugin from:
" http://www.vim.org/scripts/script.php?script_id=159
" Set leader key
let mapleader = ","
" Map NERDTree to \p
nmap p :NERDTreeToggle
" Filetype
set filetype=on
filetype plugin on
filetype indent on
" Set global settings for indentation
set ai
set ts=4
set sts=4
set et
set sw=4
set textwidth=79
" HTML tab width 2 chr, no wrapping
autocmd FileType html set sw=2
autocmd FileType html set ts=2
autocmd FileType html set sts=2
autocmd FileType html set textwidth=0
" XHTML tab width 2 chr, no wrapping
autocmd FileType xhtml set sw=2
autocmd FileType xhtml set ts=2
autocmd FileType xhtml set sts=2
autocmd FileType xhtml set textwidth=0
" Python tab width 4 chr, wrap at 79th char
autocmd FileType python set sw=4
autocmd FileType python set ts=4
autocmd FileType python set sts=4
autocmd FileType python set textwidth=79
" CSS tab width 2 chr, wrap at 79th char
autocmd FileType css set sw=2
autocmd FileType css set ts=2
autocmd FileType css set sts=2
autocmd FileType css set textwidth=79
" JavaScript tab width 4 chr, wrap at 79th
autocmd FileType javascript set sw=4
autocmd FileType javascript set ts=4
autocmd FileType javascript set sts=4
autocmd FileType javascript set textwidth=79
" Setup OmniCompletion
" This sets up OmniCompletion for Python, Javascript, HTML and CSS
" Shortcuts
" Ctrl+X, Ctrl+O OmniComplete
" Ctrl+X, Ctrl+P Complete keyword any keyword in the file
" Ctrl+X, Ctrl+L Complete the line based on the lines in the file
autocmd FileType python set omnifunc=pythoncomplete#Complete
autocmd FileType javascript set omnifunc=javascriptcomplete#CompleteJS
autocmd FileType html set omnifunc=htmlcomplete#CompleteTags
autocmd FileType css set omnifunc=csscomplete#CompleteCSS
" Tab completion
let g:SuperTabDefaultCompletionType = "context"
set completeopt=menuone,longest,preview
" Window Splits
" Vertical split : Ctrl+w v
" Horizontoal split: Ctrl+w s
" Close current window: Ctrl+w q
map j
map k
map l
map h
" Turn on line numbers
set number
" Highlight current line only in insert mode
autocmd InsertLeave * set nocursorline
autocmd InsertEnter * set cursorline
highlight CursorLine ctermgb=8 cterm=NONE
" Incremental search
set incsearch
" Toggle line numbers and fold column for easy copying
nnoremap :set nonumber!:set foldcolumn=0
" Custom mappings for accesibility
map O
map o
I hope this works out for whoever that uses this. Instructions on what the commands are can be found in the two websites that I mentioned above. Now I have given up on Aptana and Eclipse. VIM is a much lighter weight editor and is so powerful. My favorite feature here is the NERDTree plugin. It’s super cool.
Source:
sontek.net