如何使VSCode识别Vue中的全局组件?

Question

你好，我有一个项目:

急速地→v3 ->Typescript(我使用Volar的。vue语法)

我创建了一个全局组件Icon因为它几乎无处不在，所以我可以键入它，而无需导入组件。问题是VSCode认为这是一些错误(没有导入)。

组件工作良好。它被导入到main.ts中的vue应用程序中。这样的:

// registration of global component <Icon />
import IconComponent from './components/ui/icon/IconComponent.vue'
app.component('Icon', IconComponent)

知道我怎么告诉VSCode"嘿，这是一个全局组件，所以不要把它标记为错误在其他。vue文件">?:)

Answer 1

我想我已经找到答案了，所以我会把它贴在这里。

在Volar github上有:

定义全局组件

"本地组件，内置组件，本地HTML元素类型检查无需配置即可使用。对于全局组件，您需要定义GlobalComponents接口，例如:">

// components.d.ts
// declare module '@vue/runtime-core' works for vue 3
// declare module 'vue' works for vue2 + vue 3
declare module 'vue' {
export interface GlobalComponents {
RouterLink: typeof import('vue-router')['RouterLink']
RouterView: typeof import('vue-router')['RouterView']
}
}
export {}