The other day I setup a quick build system for Lux Ahoy based on jQuery’s Makefile. One of the nifty bonuses was the JavaScript syntax checker JSHint. It gives tons on tips on how to clean up your code, and can even detect potential errors. If you want to try it out, just head to jshint.com with some code ready to paste and get Linting!
To get the most out of a syntax checker I want it built into my text editor and maybe even run every time I save a JavaScript file. Enter JSHint for Sublime Text 2 and Sublime Package Control. JSHint for Sublime will output all of the linty goodness in Sublime Text’s console. All the instructions are there and if you haven’t added any packages to Sublime you’ll quickly get addicted. I’ve also installed SublimeLinter which highlights code inline. That should annoy me into cleaning up my code, or drive me to write everything in CoffeeScript!
After a couple of hours SublimeLinter turns out to be the perfect companion with fewer white space errors than JSHint for Sublime. Are those from jslint or an older version of jshint? Keep your columns Douglas Crockford!
JSLint by default is supposed to highlight whitespace issues such as no space between “function” and ‘(‘. However, I am not seeing SublimeLinter pick these up. Is that your experience as well?
I prefer it that way. I think the issues you are referring to are legacy features of JSLint that are not observed by JSHint. See the “white” option in http://www.jshint.com/options/
It picks up trailing whitespace and mixed tabs and spaces at the beginning of lines, and you can toggle those and other features pretty easily in the Package Settings. Here are my user settings for SublimeLinter:
{"sublimelinter_popup_errors_on_save": true,
"sublimelinter_gutter_marks": false,
"jshint_options": {
"evil": false,
"browser": true,
"devel": true,
"jquery": true,
"regexdash": true,
"wsh": true,
"trailing": true,
"sub": false,
"laxbreak": true,
"laxcomma": true,
"smarttabs": true,
"white": false
},
"csslint_options": {
"floats": false,
"font-sizes": false,
"ids": false,
"important": false,
"outline-none": false
}
}