How can I run eslint --fix on my JavaScript in Intellij-IDEA, Webstorm, other JetBrains IDEs?

Question

When I save a file, I would like to run eslint, and have it fix any issues that eslint can fix.

I know this can be accomplished using the command line by running applying the --fix argument.

I also know that Intellij-IDEA has integration with Eslint directly; however, Intellij-IDEA uses stdin for it's integration which means you can't pass --fix as an argument.

Answer 1

With a few quick steps you can setup a file watcher that will run eslint --fix on the files you save.

Step by step:

• Install the File Watcher plugin
• Navigate to Preferences > Tools > File Watchers and create a new File Watcher
• Choose File type: JavaScript
• Optionally, apply a scope for the watcher. For example, I chose $ProjectFileDir$/apps/web/src/ and included all of it's contents recursively.
• Choose the program to run. With node, npm, and eslint installed point to the eslint bin. In my project, the path was $ProjectFileDir$/apps/web/node_modules/eslint/bin/eslint.js
• Apply the following arguments to run eslint with the fix option on the file that was saved --fix $FileName$
• Specify the working directory as $FileDir$.

Name, and save the File Watcher. Then, edit a JavaScript file in the directory you scoped and watch many of your errors and warnings go away! Thanks Eslint!

Note: If you find Intellij-IDEA asking if you want to load file changes without you saving know (which gets annoying) it's because the IDE is saving in the background. You can uncheck Immediate file synchronization to have a better editing experience.