Awesome vim support for javascript with jsctags and taglist-plus

Exuberant-Ctags is a great way to navigate through code, but it doesn’t work so well for Javascript due to the complexity of parsing the language. Fortunately, the fine folks at Mozilla have made jsctags, which handles the job pretty darn well by using an inbuilt Javascript parser.

Given the following code,

    var objectNamespace = {};
    objectNamespace.num = 1;
    objectNamespace.func = function() {};

Jsctags produces:

As you can see, jsctags is able to identify all the variables and methods, the namespaces they belong to, and even their types!

Here are a couple more examples, using a variety of techniques from Angus Croll’s post on Namespacing in Javascript:

In every case, jsctags successfully infers the ‘namespace’ of the function, despite the fact that this namespace was declared in a different manner each time!

Module Pattern 3 is a particularly impressive display of jsctag’s capabilities: The binding of this, set via the .apply() method, is resolved correctly.

All these goodies are now accessible to vim users via the taglist-plus plugin: It’s based off the code of the original taglist.vim, but adapted to handle both jsctags as well as the standard ctags. I’ve thrown in a few other goodies as well:

I’ve also fixed a bug in the original taglist.vim where closing the taglist window doesn’t return the cursor to the last focused buffer.

Installation

Taglist-plus can be obtained either from github or vim.org. Unzip the files to your .vim directory.

jsctags can be obtained via github. It requires a recent version of node.js – the default one provided in Maverick Meerkat won’t cut it. You can build it from source or get it via this PPA.

If you’re going the PPA route, you’ll need to map nodejs to node. Here are the commands:

sudo add-apt-repository ppa:richarvey/nodester
sudo apt-get update
sudo apt-get install nodejs
sudo ln -s /usr/bin/nodejs /usr/local/bin/node

Usage

:TlistToggle brings up the taglist window. More commands can be found via :help taglist-commands.

Related Posts

Jez Ng 14 March 2011
blog comments powered by Disqus