ToolsVIM

Setup local eslint for JavaScript for VIM with syntastic

Use one of plugin managers

Vim-Plug
NeoBundle
Vundle
Pathogen
Vim-Addon-Manager

Install plugins

Add lines in .vimrc

1
2
Plug 'scrooloose/syntastic'
Plug 'mtscout6/syntastic-local-eslint.vim'

Run below commands to install those two plugins in vim.

First one applies changes to vim while you are opening .vimrc file.
Second does installing plugins. (this may differ by the manager)

1
2
:so %
:PlugInstall

Install Eslint as a checker for JavaScript

Order matters here.

Please make sure remove global eslint first.

Install eslint in local repo

1
npm i -D eslint

Then, install eslint-cli package in global scope.

1
npm i -g eslint-cli

Make sure that you can still run eslint but it will run local eslint instead.

Now let's configure the syntastic in .vimrc There are tons of options in syntastic but this may be a good start.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
" syntactic
set statusline+=%#warningmsg#
set statusline+=%{SyntasticStatuslineFlag()}
set statusline+=%*

let g:syntastic_always_populate_loc_list = 1
let g:syntastic_loc_list_height = 5
let g:syntastic_auto_loc_list = 1
let g:syntastic_check_on_open = 1
let g:syntastic_check_on_wq = 1
let g:syntastic_javascript_checkers = ['eslint']

let g:syntastic_error_symbol = '❌'
let g:syntastic_style_error_symbol = '⁉️'
let g:syntastic_warning_symbol = '⚠️'
let g:syntastic_style_warning_symbol = '💩'

highlight link SyntasticErrorSign SignColumn
highlight link SyntasticWarningSign SignColumn
highlight link SyntasticStyleErrorSign SignColumn
highlight link SyntasticStyleWarningSign SignColumn

init eslint for repository

1
eslint --init

Follow the instructions and answer the questions.

Now you are all set.

Share