Sublime Text is a very popular code editor for web work, and for good reason: it is extremely powerful and easily extended.
JSHint is “a tool to detect errors and potential problems in JavaScript code and can be used to enforce coding conventions”: it’ll check your JavaScript and let you know of any perceived imperfections before you deploy it.
You probably don’t want to be pasting into the web interface every time you want to check some code so let’s get JSHint installed into Sublime Text 2.
- JSHint depends on Node.js, so download it and install it using the installer. It’ll put its files in your hidden
/usr/local/bin
folder. - Next make sure you have Package Control installed in Sublime Text (this should probably be the first thing you do with the program). Follow the instructions at the link.
- Bring up Package Control inside Sublime Text by using (on a Mac)
Cmd-Shift-P.
- Begin to type “install” in the search box and hit return when “Package Control: Install Package” appears.
- Begin to type “jshint” and you’ll see that Package Control finds not one but two options:
Now, if you install the first one you might find you get this error when you try to check a JavaScript file:
[Errno 2] No such file or directory
[path: /usr/local/share/npm/bin:
/usr/local/bin:/opt/local/bin]
The solution is to install the second instead, “Sublime-JSHint”. Once this is done, go to Tools → Build System
in Sublime Text and select JSHint.
Now when you open up a JavaScript file you can use Cmd-B
to check it (or use Tools → Build
from the menu) and JSHint will do its stuff!
Look at all those lovely errors! (JSHint’s defaults are actually very strict but these can be configured to your liking.) Happy coding!
Discover more from Gavin Orland
Subscribe to get the latest posts sent to your email.
Gavin says
If you still encounter build problems with this, open up the file JSHint.sublime-build and replace this line (line 6 in the current build):
with this one:
…and you should be good to go.
Don says
Thank you! I wasn’t seeing any build problems on OS X but JSHint simply did nothing when I ran it – this tip fixed it.
Gavin says
I’m glad that helped, Don!
Quang says
I think the reason you get the
[Errno 2] No such file or directory
when you install JShint from uipoet is because you haven’t install JSHint yet.
Try doing: npm install -g jshint
And verify in your command-line/terminal: jshint
It won’t give you anything because you don’t specify any input file yet, but if there is no error meaning you success install JSHint for nodeJS.
Now try JSHint for Sublime again and it should work. Note that if you are on Windows machine you may need to close all your Sublime Text instances, and re-open them again to update your enviroment path to the jshint.cmd.
Sanyam Agrawal says
Thats .. Exactly the problem i was facing
Quang says
/* this post is to subscribe me to notification, since I forgot to do that on last comment. */
Robert Baindourov says
How to you get instant error notification in the gutter?
I followed your instructions, and can execute jshint in the console, and I installed JSHint-Gutter, but it still didn’t work.
Gavin says
I’m not familiar with getting hinting working in the gutter I’m afraid.
Christian says
the second package recommended in the main article ‘Sublime-JSHint’ seems no longer available, but it was easily resolved for me by the node jshint module globally:
npm install -g jshint
Gavin says
Right – thanks for that. I’ve also found it necessary to install a fair few things globally (and sometimes using sudo) for them to work properly.
fake jake says
THANK YOU SO MUCH
Steve says
This does not address the issue for Linux users. Specifically there is no jsHint/scripts/run.js file at all, and there are no provisions for “linux” os,
this is the third week of tryuing to sort this for Ubuntu 14:04 sublimetext2 using lates version of Node npm and JsHint
All I can seem to find is mac solutions
Gavin says
Just an update to this post, which is two years old now. A lot has happened since then: I moved over to Grunt, then replaced Sublime Text with WebStorm, then replaced Grunt with Gulp.
forumer says
I am posting it here since I have not received any replies on uipoet.
I’d appreciate your help …
On Windows 7, Sublime Text 2. I’ve done/redone the following a few times!
I successfully installed jshint via node.js: npm install -g jshint
Then I installed JSHint package in Sublime.
I get the following error when I do CTRL-B in sublime Text 2
C:\Users\ml414c\AppData\Roaming\Sublime Text 2\Packages\JSHint\reporter.js:18
buffer += ‘[JSHint: ‘ + results[0].file + ‘]\n\n’;
^
TypeError: Cannot read property ‘file’ of undefined
at exports.reporter (C:\Users\ml414c\AppData\Roaming\Sublime Text 2\Packages\JSHint\reporter.js:18:37)
at Object.exports.run (C:\Users\xxx\AppData\Roaming\npm\node_modules\jshint\src\cli.js:654:35)
at Object.exports.interpret (C:\Users\xxx\AppData\Roaming\npm\node_modules\jshint\src\cli.js:737:18)
at Object. (C:\Users\ml414c\AppData\Roaming\npm\node_modules\jshint\bin\jshint:3:26)
at Module._compile (module.js:460:26)
at Object.Module._extensions..js (module.js:478:10)
at Module.load (module.js:355:32)
at Function.Module._load (module.js:310:12)
at Function.Module.runMain (module.js:501:10)
at startup (node.js:129:16)
Gavin says
I’m afraid I personally don’t have time to help with this, but I recommend WebStorm: https://www.jetbrains.com/webstorm/