问题出现的原因
原因就出现在生成的文件 components.default.d.ts
这是生效的代码
export {}
declare module 'vue' {
export interface GlobalComponents {
UIButton: typeof import('./../components/UIButton/UIButton.vue')['default']
UniCol: typeof import('@dcloudio/uni-ui/lib/uni-col/uni-col.vue')['default']
}
}
这是不生效的代码
import '@vue/runtime-core'
export {}
declare module '@vue/runtime-core' {
export interface GlobalComponents {
UIButton: typeof import('./../components/UIButton/UIButton.vue')['default']
UniCol: typeof import('@dcloudio/uni-ui/lib/uni-col/uni-col.vue')['default']
}
}
虽然有办法解决 unplugin-vue-components 不能识别组件的自动导入的类型 (pnpm) - 掘金 (juejin.cn)
,但是这已经是过去时了,当出现使用了 Vue - Official 扩展插件是,就需要换个方式。
不生效的原因是因为 Vue - Official 这个vscode插件做了修改 language-tools/extensions/vscode/README.md at 70b5d862d0847d58dda9f2d78e30f9f75b11955d · vuejs/language-tools (github.com)
Vue >= 2.7 时,应该使用如下类型声明:
declare module 'vue' { // Vue >= 2.7
// declare module '@vue/runtime-dom' { // Vue <= 2.6.14
export interface GlobalComponents {
RouterLink: typeof import('vue-router')['RouterLink']
RouterView: typeof import('vue-router')['RouterView']
}
}
unplugin-vue-components
该插件已经在 0.27.0 版本之后解决了
在文件 src/cord/declaration.ts
中已经直接改成了 declare module 'vue'
,没有判断
@uni-helper/vite-plugin-uni-components
该插件在 0.0.9 版本还没有修改,但是有人已经提出了PR fix: vue version check,等待作者合并并发布。
简单解决版本:
加载依赖后,找到代码文件
@uni-helper/vite-plugin-uni-components/dist/index.cjs 163行代码
@uni-helper/vite-plugin-uni-components/dist/index.mjs 153行代码
修改
ctx.options.version === 2.7
为
ctx.options.version >= 2.7
当然也可以自己发布一个npm包去处理