Vue IntelliSense

A CLI tool to help enabling IntelliSense on your Vue components

npm i -D vue-intellisense

# or globally
npm i -g vue-intellisense

Usage

You'll need VSCode and Vetur installed.

Vetur has a feature to get IntelliSense for your Vue components, however, you need to provide a bunch of config files for this.

The Vue IntelliSense CLI generates the required files with zero-config required!

TLDR;

Generate the required Vetur files for all your Vue components:

vue-int --input /src/components --output vetur --recursive

Then add this to your package.json:

{
  "vetur": {
    "tags": "vetur/tags.json",
    "attributes": "vetur/attributes.json"
  }
}

That's it! 🎉

Motivation

Check out the blog post!

CLI Manual

Usage
  $ vue-int --input <path> --output <path>

Options
  --output, -o  A folder to save the generated files.
  --input, -i  Either a Vue file, or a folder with vue components. In case it's a folder, it will not care about nested folders.
  --recursive, -r  consider all vue files in all nested folders as well.
  --alias, -a  List files contain aliases config.

Examples
  # target a specific Vue file to generate IntelliSense for
  $ vue-int --output 'vetur' --input 'src/components/MyButton.vue'

  # target all files in a folder - without nested folders
  $ vue-int --output 'vetur' --input 'src/components'

  # target all files in a folder - with nested folders
  $ vue-int --output 'vetur' --input 'src/components' --recursive

  # target all files in a folder - with nested folders and and using alias for import
  $ vue-int --output 'vetur' --input 'src/components' --recursive --alias alias.config.js other-alias.config.js

  # support nested object inside config file like: { resolve: { alias: { "@components": "/src/components" } } }
  $ vue-int --output 'vetur' --input 'src/components' --recursive --alias webpack.config.js#resolve#alias other-alias.config.js

Exits with code 0 when done or with 1 when an error has occured.

Contributing