VueJS setup for Atom

Question

I was looking for linter and hinter for VueJS. Also i am using tyepsript everywhere so js-hint and linter-jscs won't be useful. I currently have these:

• language-vue
• atom-beautify
• emmet
• linter
• linter-ui-default

The features i need:

• Variable declaration errors
• Semi colon warnings
• Jump to variable description
• If possible Bootstrap-Vue tag completion
• Basic snippets

Answer 1

To enable Emmet with Vue language on Atom

• Go to keymap.cson on your atom editor (Atom item menu on top)

• Copy and paste this code

  'atom-text-editor[data-grammar~="vue"]:not([mini])': 'tab': 'emmet:expand-abbreviation-with-tab'

Answer 2

Basic snippets

• https://atom.io/packages/vuejs2-snippets

Linter

• https://atom.io/packages/linter-eslint (you should install eslint-plugin-vue in your project)