soledad penadés

Since I am practically perfect in every way^*, I rarely rely on syntax checking, but sometimes obnoxious errors will slip in when I get distracted, and it's good to have something carefully inspecting the code and gently warning you if it finds errors. Syntastic, a plug-in for syntax checking on Vim by Martin Grenfell (AKA scroolose), does exactly that and for a lot of different languages. However, as I focused on Javascript, an extra piece was required: something that knows how to validate Javascript, and informs Syntastic about it. I decided to install JSHint.

So without further ado, here's how I installed Syntastic with JSHint for Javascript checking on Vim:

1. Installing pathogen

Since Syntastic uses another Vim plug-in called pathogen, you need to install pathogen first:

mkdir -p ~/.vim/autoload ~/.vim/bundle;
curl -so ~/.vim/autoload/pathogen.vim https://raw.github.com/tpope/vim-pathogen/master/autoload/pathogen.vim

Now add this to your .vimrc file:

call pathogen#infect()

I added it at the end, and it seems to work fine.

2. Installing Syntastic

To actually install Syntastic we just need to place its code in the ~/.vim/bundle/syntastic directory. This can be done by simply changing to that directory and cloning it, as described by Syntastic's installation instructions:

cd ~/.vim/bundle
git clone https://github.com/scrooloose/syntastic.git 

Also available in submodule flavour

But since my whole .vim directory is git-versioned, I thought it would be more elegant to add it as a git submodule. That way, I can get Vim configured to my tastes in a new machine in a couple of minutes!

So this is how I did it:

cd ~/.vim
git submodule add https://github.com/scrooloose/syntastic.git bundle/syntastic

Close Vim and reopen it and try typing this to test it works:

:Helptags

As Syntastic manual reads, if you get an error at this point, something went wrong. In my case was fine so I moved on to installing JSHint.

3. Installing JSHint

JSHint is actually a Javascript library. So for running it we need some sort of wrapper--and turns out there's a node.js module for that, called jshint! Hence, you need to install node first (that is your homework). Once node.js is ready, we'll use npm (node package manager), which comes bundled with node.js:

sudo npm install -g jshint

Why sudo? Because we're telling npm to make a global (-g) installation, so that the jshint command line tool is available and in the path. (NOTE: If you know of a better way so that it's installed for the current user only, let me know in the comments. Thanks!)

At this point maybe you need to close and open again Vim, but other than that, JSHint should be responding to Syntastic pleas for help each time you save a JS file, and you'll be getting a little bit of help right in your editor; every time you make an error, there will be a couple of arrows mercilessly pointing to your error. And they won't go away until you fix them ;-)

Shamelessly hotlinking Syntastic's screenshot:

Thanks to Ernesto and Belén for insisting in recommending me this plug-in!