Linting JavaScript in Sublime Text

Posted on Fri, 26 February 2016 in development

I had to jump through a few hoops to get ESLint to work in Sublime Text. Let this be a note to self for future reference and hopefully for some help someone struggling the same thing.

Setting the Stage

The issues I had getting things up and running are related to the setup I currently have.

  • OS X 10.11.3 El Capitan
  • Sublime Text 3 (Dev Channel, Build 3107)
  • Node.js (4.3.1) installed via nvm (0.30.2)
  • Need support for ES2015, React, Node.js and browser

Setting up ESLint

Getting ESLint installed is pretty straight forward operation, just follow the Getting Started Guide.

I installed it globally with

$ npm install -g eslint

… initialized a new empty project with (to create package.json)

$ mkdir eslint-demo
$ cd eslint-demo
$ npm init

… and initialized in the project directory with

$ eslint --init
? How would you like to configure ESLint? Use a popular style guide
? Which style guide do you want to follow? AirBnB
? What format do you want your config file to be in? JSON

Hoop no. 1. Since I installed ESLint globally, I needed to install few packages also globally to make ESlint work:

$ npm install -g eslint-plugin-react
$ npm install -g eslint-config-airbnb

After that created a JavaScript test file and I could start linting in the terminal, like so:

$ eslint demo-code.js

Hooray!

Setting up Sublime Text

I already had Sublime Linter installed for Python linting.

Sublime Linter plugs to ESLint with a plugin called SublimeLinter-eslint, so I installed that via Package Control with the instructions provided.

Happy linting time? Nope.

Hoop no. 2. Since I have Node.js installed via nvm, I needed to add Node.js binary path to SublimeLinter.sublime-settings. To get the correct path:

$ which node
/Users/me/.nvm/versions/node/v4.3.1/bin/node

I added this to SublimeLinter.sublime-settings:

"paths": {
            "linux": [],
            "osx": [
                "/Users/me/.nvm/versions/node/v4.3.1/bin/node"
            ],
            "windows": []
        },

…and restarted Sublime Text.

Still no cigar.

Hoop no. 3. Since I have Node.js installed via nvm, I had to set an alias (which I had not done previously, for some reason):

$ nvm alias default v4.3.1

… and restarted ST.

Yay! Finally ESLint worked in ST and I could see some (too many for good code, ahem…) linting errors and warnings on the gutter.

Let this be a note for future reference for me, and possibly for you too. Did I just repeat myself? Anyways, happy linting!