ESLint in WebStorm

ESLint in WebStorm

You need to point that field to the actual ESLint script. This would usually be the place where youve installed the ESLint npm package or command-line tool.


OS X El Capitan

Ive installed npm & node with brew. Its easy to keep stuff up to date with brew.

  1. brew install node

then installed eslint globally with npm

  1. npm i eslint -g

and here is my working config:

  1. /usr/local/bin/node /usr/local/lib/node_modules/eslint

I add .eslintrc file with eslint rules in projects root folder.

Try using those drop-downs next to input field, webstorm gives path w/o any typing.


ESLint in WebStorm

Following are the steps you need to get it working on Windows 10:

  1. Open command prompt and navigate to your project root.

  2. Run the following command:
    npm install eslint --save-dev

  3. Once ESLint finishes installing in the above step, navigate through the following menus in Webstorm:
    File > Settings.... Click on Settings…

  4. In the Settings screen that shows up, in the top-left hand corner, there is a Search box. Type eslint in it.

  5. That will show you the ESLint settings for this project. Now tick the checkbox that says Enable. Make sure that the Node interpreter: has the right value. In my case, it was C:Program Filesnodejsnode.exe

  6. Just below the Node interpreter: setting, there is a setting called ESLint package:. If you have correctly installed the ESLint package as I mentioned in Step 2 above, this setting will be auto-populated to show the current path of ESLint package from your projects node_modules folder. In my case, the value of this setting was:
    D:wwwgdpnode_moduleseslint (gdp is my project root folder)

  7. Click on Apply and OK buttons respectively.

  8. Restart Webstorm. If you have successfully completed all the steps, you will not see the prompt to enter the ESLint again.

  9. Enjoy!!!

Leave a Reply

Your email address will not be published.