Vim and Svelte.js

05/21/20191 Min Read — In Vim, JavaScript, Svelte.js

Yesterday I explained how you can add linting and formatting support for Svelte.js with ESLint and Prettier.

But how can you integrate it into (Neo)Vim and ALE?

1. Installation

  1. Follow the steps here to get up and running with ESLint and Prettier.
  2. Install ALE with your favorite Vim plugin manager (I use minpac).
  3. optional: Install burner/vim-svelte for syntax highlighting.

2. Configuration

There is no native support for .svelte files but you can define an alias.

let g:ale_linter_aliases = {'svelte': ['css', 'javascript']}
let g:ale_linters = {'svelte': ['stylelint', 'eslint']}

Now, files with a .svelte extension will use the linters for CSS and JavaScript. Then it uses the linters you defined in the ale linters object.

3. How to Use

If you run :ALEFix or :ALELint in (Neo)Vim, ALE should work.

I suggest customizing ALE to run when you save a file:

let g:ale_lint_on_save = 1
let g:ale_fix_on_save = 1
let g:ale_lint_on_enter = 0
let g:ale_lint_on_text_changed = 'never'