Vim use ESLint via ALE Jul 17 2017

Why ALE and not Syntastic ? just personal preference, ALE seems to take advantage of the async in Vim 8, just that.

What would we need:

• Install - ESLint
• Have a Vim plugin manager, I prefer/use Plug
• Install - ALE

Installing ESLint is very straightforward using NPM  in general just(this will install it in your current directory if you want it global use the -g flag, you should have initialized your npm in the current project npm init prior to run this command):

1
$ npm install eslint --save-dev

Then initialize your ESLint installation:

1
$ ./node_modules/.bin/eslint --init

Answer the questions and you are ready to use ESLint on your files. for example:

1
$ ./node_modules/.bin/eslint map.js

Step 2. Configure your Lint rules, a simple eslintrc: would look like this(save this file as .eslintrc.js):

1
2
3
4
5
6
7
8
module.exports = {
  "env": {
    "es6": true
  },
  "rules": {
    "quotes": ["error","double"]
  }
};

This sets the env to use es6 and defines only one rule to mark as an error if the quotes are not double quotes in the code.

For more rules and configurations for ESLint check their documentation

Step 3. Installing the ALE plugin, add to your vimrc:

1
Plug 'w0rp/ale'

Save your vimrc and run:

1
2
:source %
:PlugInstall

Now to configure the linters you wish the plugin to run add the following lines to your vimrc, I'll just add JavaScript:

1
2
3
4
" Linter configuration
let g:ale_linters = {
  \   'javascript': ['eslint'],
  \}

Source your vimrc to apply the changes to the current vim instance (or quit and reopen vim).

1
:source %

And now you are ready to run lint on your files from vim.

Enjoy.

PS. The whole point of using ALE was to use the Asynchronous part of the acronym (ALE-Asynchronous Lint Engine), but if you wish to just run the lint on demand you could set ALE to only run on demand. Add this to your vimrc:

1
2
" This flag can be set to 0 to disable linting when the buffer is entered.
let g:ale_lint_on_enter = 0

And then you can Toggle activate/deactivate Ale

1
 :ALEToggle