跳转到内容

TS

引入vue文件时提示找不到该模块

component: () => import("@/views/elementPlus/elementTable.vue"),提示找不到vue文件

在根目录添加types/shims-vue.d.ts

(shims-vue.d.ts)

declare module '*.vue' {
  import type { DefineComponent } from 'vue'
  const component: DefineComponent<{}, {}, any>
  export default component
}

确保ts配置文件中include 或 files 包含类型文件路径

(tsconfig.json)

{
  // 需要被编译的文件列表
  "include": ["**/*.d.ts"],
}

TS单行注释不校验

// @ts-ignore

TS引入第三方插件报错

如下引入draggable

import draggable from "vuedraggable/src/vuedraggable";

报错ts报错文件“f:/11/vue/node_modules/vuedraggable/src/vuedraggable.d.ts”不是模块

解决方法:

在(根目录、src目录、或type目录无具体要求)下创建文件shims-vue.d.ts

文件内输入以下内容:

declare module 'vuedraggable/src/vuedraggable' {
  import { DefineComponent } from 'vue'
  const draggable: DefineComponent<{}, {}, any>
  export default draggable
}

// 以下组件同理,替换路径'vuedraggable/src/vuedraggable'和名称即可draggable
declare module '*.vue' {
  import type { DefineComponent } from 'vue'
  const component: DefineComponent<{}, {}, any>
  export default component
}

declare module 'vue3-puzzle-vcode' {
  import { DefineComponent } from 'vue'
  const Vcode: DefineComponent<{}, {}, any>
  export default Vcode
}

确保tsconfig.json配置文件里编译.d.ts类型文件

{
  // 需要被编译的文件列表
  "include": ["**/*.ts", "**/*.tsx", "**/*.vue", "**/*.d.ts"],
}