An experienced Senior Front End Web Developer

Installing JSHint for Sublime Text 2

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.

  1. 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.
  2. 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.
  3. Bring up Package Control inside Sublime Text by using (on a Mac) Cmd-Shift-P.
  4. Begin to type “install” in the search box and hit return when “Package Control: Install Package” appears.
  5. Begin to type “jshint” and you’ll see that Package Control finds not one but two options:
Package Control JSHint

Sublime Text Package Control

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:

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!

JSHint in action

JSHint in action

Look at all those lovely errors! (JSHint’s defaults are actually very strict but these can be configured to your liking.) Happy coding!

15 comments so far:

  1. 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):

    "node", "$packages/Sublime-JSHint/scripts/run.js", "$file_name",

    with this one:

    "/usr/local/bin/node", "$packages/Sublime-JSHint/scripts/run.js", "$file_name",

    …and you should be good to go.

  2. 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.

  3. /* this post is to subscribe me to notification, since I forgot to do that on last comment. */

  4. 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.

  5. 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

  6. 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

  7. 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.

    • 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 (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)

Comment on this: