a blog for those who code

Tuesday 3 January 2017

Setup ESLint in Sublime Text 3

In this post we will be discussing about setting up ESLint in Sublime Text 3. Linting is a process of running a program that will analyse code for potential errors in your application. A Lint or a Linter is a program that verifies the code quality. ESLint is an open source project which provides a plug-gable linting utility for JavaScript.

In our previous post we have discussed about how could we do linting in Node.js using ESLint. If you are using Sublime Text 3 for developing your JavaScript or Node.js applications ,then it would be better if you setup the ESLint directly which will give you the instant error and thus you do not have to run it from the console every-time. We will show you step by step process to setup ESLint in Sublime Text 3.

Step 1 : Install ESLint globally using NPM

npm install -g eslint

Step 2 : Install Package Control in Sublime Text 3

For installing the Package Control in Sublime Text 3 we have to copy the code from PackageControl.IO and run it in the console of Sublime Text.

The console can be accessed via the shortcut ctrl + ` or the View > Show Console menu.


Now you have to copy the code to the console and hit enter, which will install the package control.

Step 3 : Next step is to install a config using NPM

Next we have to install a configuration of eslint using the command npm install --save-dev eslint-config-rallycoding.

Step 4 : Extending the Configuration

Now we have to create a .eslintrc file inside our project and tell ESLint to make use of the configuration as shown below :

{
  "extends" : "rallycoding"
}

Step 5 :  Adding Linter and ESLint to Sublime Text

Next we have to add a linter and eslint to sublime text using Package Control. At first we will open up the Command Pallet using the shortcut Ctrl + Shift + P and then search for Install Package. It will load up the Installation window where we have a list of packages available to be installed. Then we will install SublimeLinter (a Linter) and SublimeLinter-contrib-eslint (ESLint).




After going through all the steps close the Sublime Text and open it again. You can see that if I do not give a semi colon it will throw an error to me as shown below :


Please Like and Share the CodingDefined Blog, if you find it interesting and helpful.

1 comment:

  1. I got:
    UNMET PEER DEPENDENCY eslint@2.13.1

    someone dealing with the same issue?

    ReplyDelete