'Vue3 Typescript error on registering component inside another
I have a Vue3 component (using TS) in which I'm trying to render another component inside it like this:
TopBar.vue
<template> <TopBarProfileDropdown /> </template>
<script lang="ts">
import TopBarProfileDropdown from 'components/layout/TopBarProfileDropdown';
import { defineComponent } from 'vue';
export default defineComponent({
name: 'TopBar',
components: { TopBarProfileDropdown },
setup() {
return {}
}
})
</script>
But I'm getting a TS compilation error:
How can I type assert an imported component and fix this?
EDIT1 Adding imported component:
<script lang="ts">
import { defineComponent } from 'vue'
export default defineComponent({
name: 'TopBarProfileDropdown',
setup() {
return {}
}
})
</script>
The component type is something like:
import TopBarProfileDropdown: ComponentPublicInstanceConstructor<...>
Sources
This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.
Source: Stack Overflow
| Solution | Source |
|---|

