A CLI tool to help enabling IntelliSense on your Vue components
npm i -D vue-intellisense
# or globally
npm i -g vue-intellisenseYou'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!
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! 🎉
Check out the blog post!
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.
Any contribution welcome! Would love for this to work with other code editors as well!