Vim and jslint

It so happened that I almost do not write on Habrahabr - this has its own reasons. But I would very much like to share one thing that will certainly be useful to all those who work with JavaScript in vim, and besides, I haven’t found such material in habrabra.


This may seem strange to some, but working in vim is really convenient (especially in the console - I am untied from gui, so I can safely work through ssh; however, the same can be done with gui). In this, I fully agree with Derek Wyatt , the author of wonderful vim screencasts. The truth is worth noting that it will be convenient after you realize that vim is a slightly different editor (because of which you need to get used to it), and also customize it a bit for yourself. About customization and will be discussed.

Those who program a lot and professionally know that the quality of the code affects the number of errors (of course this is not the only factor). Also, they are often aware of the existence of lint-tools (started with the lint program, written in Bell Labs by Stephen Johnson), helping the programmer to check his and someone else's code for suspicious, potentially dangerous constructions, as well as just syntax errors. And if for php it is easy enough to enable lint-mode - you just need to add two lines to ~/.vim/ftplugin/php.vim ( Slides and Andrey ~/.vim/ftplugin/php.vim files ).
')
set makeprg=php\ -l\ %
set errorformat=%m\ in\ %f\ on\ line\ %l

and use: make to check, then to validate javascript you need to put some more effort, which I am going to talk about.

For JavaScript, there is JSLint - an online tool for checking js code. Our task is to launch it offline.

For this, depending on the operating system and available programs, we will need

1. Little time
2. Naturally, VIM itself
3. JSLint sources
4. One of the JavaScript engines - for example SpiderMonkey , Rhino , or any other engine . The owners of OSX are lucky a little more - it has JavaScriptCore ready for use (Webkit engine).

Suppose that you have vim, and some JavaScript engine is already installed (if you have questions about installation, it’s best to ask them in the comments). You should also separately clarify the situation with WSH Command Line and Rhino - there are special versions for them - www.jslint.com/wsh/index.html and www.jslint.com/rhino/index.html , respectively. I will tell you how to run JSLint for SpiderMonkey / JavaScriptCore.

To achieve the goal, you will need to edit ~/.vim/ftplugin/javascript.vim , adding such lines there

if filereadable( 'PATH_TO_JS_ENGINE' )
set makeprg=PATH_TO_JS_ENGINE\ ~/.vim/jslint_runner.js\ <\ %:p
set errorformat=Line\ %l\ column\ %c:\ %m
endif

where PATH_TO_JS_ENGINE is the path to your js engine (for mac it is /System/Library/Frameworks/JavaScriptCore.framework/Versions/A/Resources/jsc , and for those who installed SpiderMonkey this is the default / usr / local / spidermonkey / bin / js ) .

After that, add the following code to the end of the fulljslint.js

 var body = [], line, num_empty_lines = 0; // ..   js-      , //        ,   //    ,    50 while ( 50 > num_empty_lines ) { line = readline(); body.push( line ); if ( 0 === line.length ) { // blank line, so increment num_empty_lines += 1; } else { // not blank, so reset num_empty_lines = 0; } } body.splice( -num_empty_lines ); body = body.join( "\n" ); //    «Good Part»,    whitespace options = { bitwise : true, // if bitwise operators should not be allowed eqeqeq : true, // if === should be required glovar : true, // if HTML fragments should be allowed regexp : true, // if the . should not be allowed in regexp literals undef : false, // if variables should be declared before used onevar : true, // if only one var statement per function should be allowed. newcap : true, // if Initial Caps must be used with constructor functions immed : true, // if immediate function invocations must be wrapped in parens plusplus : true, // if increment/decrement should not be allowed nomen : true // if names should be checked }; //      ,   //   js- /*jslint onevar: true, undef: true, nomen: true, eqeqeq: true, plusplus: true, bitwise: true, regexp: true, strict: true, newcap: true, immed: true */ var result = JSLINT( body, options ); if ( !result ) { for ( i = 0; i < JSLINT.errors.length; i+=1 ) { var err = JSLINT.errors[i]; print( 'Line ' + err.line + ' column ' + err.character + ': ' + err.reason ); } } else { print( 'No errors found' ); } 

and save the resulting file as ~/.vim/jslint_runner.js .

The last code is not my personal one, I found it on the Internet and only slightly edited it.

After ~/.vim/ftplugin/javascript.vim and ~/.vim/jslint_runner.js are govtovy, you need to do :so ~/.vim/ftplugin/javascript.vim , or just restart vim. After that, you can safely perform :make , and if there are errors, navigate through them with :cn and :cp ( :h quickfix ).

I also know that there are plugins for vim ( example ) and other discussions of this problem ( example ). If you know something else useful on this topic - welcome to the comments, I will be grateful.

ps. For Windows, there are a few differences, except WSH - vim's home folder is in a different place, and .vimrc turns into vimrc.

pps. Article prepared with the help of vim.