Auto import component
on type-ahead since version 0.30.0.
Be sure to enable this on your settings.json
to match the casing of your file:
{
...,
"vetur.completion.tagCasing": "initial"
}
Adds import
statement and component
property to current .vue single file component file. Imports kebab-case.vue
or PascalCase.vue
.
Via:
- Placing your cursor on the component tag inside
<template />
section and triggering keybind/command pallete. - (TODO) specifying component name in command pallete.
- (TODO) import all components in file in one go.
(place cursor on MyComponent
tag)
<template>
<MyComponent />
</template>
<script>
export default {};
</script>
Press keybinding (default: ctrl+i / MacOS = cmd+i)
or Command Pallete Vue: Import vue component at cursor
<template>
<MyComponent />
</template>
<script>
import MyComponent from '../../../MyComponent.vue';
export default {
components: {
MyComponent,
},
};
</script>
vue-component-importer.enableDebugMessages
: enable/disable debug messages
Ctrl+i (MacOS = Cmd+i)
: Trigger cursor position import
Vue: Import vue component at cursor