Typescript导入vue文件爆出找不到模块,解决办法:

vue 2的解决办法,针对vue文件导入报错

创建一个shims.d.ts文件,放置到src/globalDeclare中

declare module '*.vue' {
  import Vue from 'vue';
  export default Vue;
}

vue 3.0的解决办法,针对vue文件导入报错

vue3.0中使用上述办法,会使createApp与vue类型不符合
在这里插入图片描述
导致Vue类型与PublicAPIComponent不符合

因此vue3中的声明方法使用以下办法:

declare module '*.vue' {
  import { defineComponent } from 'vue';

  const Component: ReturnType<typeof defineComponent>;
  export default Component;
}

注意,该模块声明需要单独创建文件声明

在tsconfig.json中添加

{
	"compilerOptions"{
		"typeRoots"[
			"src/globalDeclare"
		]
	}
}

通过上述办法将不会报错

Logo

前往低代码交流专区

更多推荐