Vim como un IDE

[Pincha aquí para ver otros artículos sobre Vim]

Este artículo es un no-tan-escueto resumen-chuleta que nos permitirá configurar rápidamente el editor Vim como un IDE completo, incluyendo:

  • Navegador de ficheros de proyecto
  • Navegador de símbolos del lenguaje (clases, métodos, miembros…)
  • Navegador de ficheros externos
  • Pestañas
  • Navegador de ficheros recientes

…y más.

Aunque en el artículo me centro en el desarrollo con el lenguaje Python y algunos de los plugins son específicos para este lenguaje, si el lector de este artículo usa Vim seguramente sabrá buscar los plugins equivalentes para el lenguaje que le interese (pista: vim.org)

Para que todo esto funciona hay que seguir estos pasos, que explicaré con detalle después:

  1. Copiamos los ficheros que contienen los plugins en el directorio “plugin” del Vim
  2. Instalación de dependencias
  3. Editamos el fichero de configuración de Vim para activar algunas opciones de los plugins
  4. Somera pero suficiente explicación del uso de cada plugin
  5. Chuleta de atajos de teclado

El artículo presupone una cierta familiaridad con el Vim. Si no se tiene, aconsejo darle primero un vistazo a mis otros artículos sobre este editor.

Vamos a ello.

1. Copia de los ficheros necesarios

Primero tenemos que copiar los ficheros que contienen los plugins en el directorio de plugins de nuestro Vim. Este directorio será el $HOME/.vim/plugin en sistemas decentes y el subdirectorio “plugin” bajo el directorio donde hayamos instalado el Vim en Windows (si el directorio no existe se crea vacío.)

Los ficheros los podemos descargar buscando el nombre de cada uno en Vim.org y cada uno de éstos ficheros añadirá una parte de la funcionalidad, en concreto:

  • bufferexplorer.vim: permite visualizar todos los buffers abiertos y navegador por ellos usando cursores y el ratón
  • mru.vim: lista los ficheros abiertos recientemente.
  • NERD_commenter.vim: comandos inteligentes para comentar y descomentar el código.
  • NERD_tree.vim: navegador del sistema de archivos.
  • project.vim: creador de proyectos con navegador de ficheros de proyecto, búsquedas y algunas cosas más.
  • pythonhelper.vim: muestra en que clase y método estamos
  • pythoncomplete.vim: completado inteligente de Python
  • taglist: muestra un listado de símbolos (clases, métodos, funciones y miembros) y nos permite saltar rápidamente a uno.
  • xml.vim: cierra y anida automáticamente las etiquetas XML/HTML y nos permite operaciones sobre ellas.

Para que el xml.vim maneje también los ficheros HTML y los HTML de plantillas de Django (no sólo los XML), una vez lo hemos copiado en el directorio plugins creamos una carpeta en .vim/ftplugins y copiamos o creamos enlaces simbólicos al xml.vim dentro de ese directorio llamándolos “html.vim” y “htmldjango.vim”.

2. Instalación de dependencias

Además de éstos ficheros de Vim, necesitamos instalar una dependencias necesarias para que funcione el taglist (y queremos que funcione). Para ello necesitamos tener instalado y en el PATH el programa exhuberant-ctags. Para este programa siempre existe una versión empaquetada en las distribuciones de Linux, pero si usamos Windows podemos bajarla de: http://ctags.sourceforge.net/.

3. Edición del fichero de configuración de Vim

Para dejar todo funcional (aunque aún no sepamos usarlo) sólo queda modificar el fichero de configuración de Vim, el $HOME/.vimrc en Unix/Mac/Linux o _vimrc en Windows. En este artículo no explico la configuración completa, sólo la que atañe a los plugins que instalamos y a la integración de nuestro Vim-IDE. Por lo tanto podemos añadir estas líneas al final del fichero:

filetype plugin on

" F2 = OmniComplete
imap <f2> <c-x><c-o>


" Configuración del autocompletado inteligente (el de Python necesita un Vim
" compilado contra las librerías de Python para funcionar)
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


" Atajos para pestañas como los de Firefox/Chrome/Opera/etc
" Control T nueva pestaña (la cerramos con :q)
map <c-t> <esc>:tabnew<cr>
" Control PageUp/PageDown cambiar de pestaña
map <c-pageup> :tabp<cr>
map <c-pagedown> :tabn<cr>


" F10 activa modo pegar (no autoindenta, no descoloca lo que pegamos), F11
" lo desactiva
map <f10> :set paste<cr>
map <f11> :set nopaste<cr>


" Nuestros valores por defecto para el plugin Project
:let g:proj_flags=“imstvcg”


" Colores que no te dejan ciego (al gusto del consumidor, se puede escribir
" :color e ir dando a tab para ver las combinaciones existentes, hay más en
" vim.org)
colors torte


" Que no haga la ventana de gvim demasiado pequeña
au GUIEnter * set lines=80 columns=160


" Plugin taglist


" F5 muestra el frame de tags
map <f5> :TlistToggle<cr>


" Poner el frame en la derecha que el Project ya lo pone a la izquierda
let Tlist_Use_Right_Window = 1


" Tamaño mínimo de frame de tags
let Tlist_WinWidth = 40


" Buffer explorer con F4
map <f4> \be

Otra opción es meter ésto es un fichero separado e incluír el fichero al final de nuestro .vimrc.

4. Explicación del uso de las partes del IDE

Antes de leer este artículo convendría tener muy claros los conceptos de buffer, ventana, pestaña y vista. Como no quería que este artículo fuera muy largo los he explicado (con un dibujo de calidad épica) en este otro artículo.