关于前端:VSCode-中TS-提示-无法找到-vue-声明文件-的解决方案

60次阅读

共计 903 个字符,预计需要花费 3 分钟才能阅读完成。

在应用 VSCode 开发 Vue3 + TS 我的项目时,编辑器始终有一个报错,因为不影响编译和运行,所以就始终没在意,但这两天看着这红杠提醒切实是太顺当,明天就来解决一下这个问题,还本人一个清新的开发环境。

在网上查找了很多材料,靠谱的不好找,然而功夫不负有心人,最终问题还是解决了,在这里记录一下,防止日后踩坑,也给有须要的敌人省点查找材料的麻烦。

报错信息

具体的报错信息如下图所示:

找不到 .vue 的申明文件,实际上就是 TS 无奈辨认 .vue 类型的文件。

那么就须要增加一下 .vue 类型文件的申明,步骤如下:

  1. 在根目录(也就是 tsconfig.json 这一级)下新建名为”vue.d.ts“的文件。文件名中的”vue“也能够改为任一名称。
  2. 在”vue.d.ts“文件中写入以下申明:

    // 以下两种计划二选一
    
    // 计划一
    declare module "*.vue" {
      import Vue from "vue";
      export default Vue;
    }
    
    // 计划二
    declare module '*.vue' {import { defineComponent} from 'vue'
      const Component: ReturnType<typeof defineComponent>
      export default Component
    }
  3. 在”tsconfig.json“中,将第二步中创立的文件”vue.d.ts“(或者你本人新建的其余名称的 .d.ts 文件)增加到 include 中:

    "include": ["vue.d.ts"],

    我这边残缺的 include 属性如下(我新建的是”app.d.ts“):

后果

最初,咱们来看一下 VSCode 中是否还有红杠报错:

报错信息没有了,功败垂成!

总结

一个清新的开发环境有助于咱们放弃身心愉悦,自然而然也就进步了工作效率,没有红杠的代码看着果然难受多了!

~

~ 本文完,感激浏览!

~

学习乏味的常识,结识乏味的敌人,塑造乏味的灵魂!

大家好,我是〖编程三昧〗的作者 隐逸王 ,我的公众号是『编程三昧』,欢送关注,心愿大家多多指教!

你来,怀揣冀望,我有墨香相迎!你归,无论得失,唯以余韵相赠!

常识与技能并重,内力和外功兼修,实践和实际两手都要抓、两手都要硬!

正文完
 0