本文介绍了VueJS/Typescript - 找不到模块“./components/Navigation"或其相应的类型声明的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

当我将脚本创建为 typescript (lang=ts") 时,我收到一个错误说明

找不到模块./components/Navigation"或其相应的类型声明 (Vetur 2307).".

我意识到这只有在我将 lang 设置为 ts 时才会发生,这正是我构建 Vue 应用程序所需要的.

app.vue

<导航/><script lang="ts">从./components/Navigation"导入导航;//这是我收到错误消息的地方导出默认{名称:'应用',成分: {导航,}}

导航.vue

<div id="nav"><router-link to="/">Home</router-link><router-link to="/about">关于</router-link><router-link to="/categories">Categories</router-link><router-link to="/random">Random</router-link>

<路由器视图/><script lang="ts">导出默认{name: '导航',}

解决方案

src 文件夹中添加文件 shims-vue.d.ts ,内容如下:

Vue 2:

声明模块*.vue";{从'vue'导入Vue导出默认 Vue}

Vue 3:

声明模块'*.vue'{从'vue'导入类型{定义组件}const 组件:DefineComponent导出默认组件}

并导入带有扩展名 .vue 的组件:

 import Navigation from './components/Navigation.vue';

而不是:

import Navigation from './components/Navigation';

When I create a script as typescript (lang="ts") I get an error stating

I realized that this only happens when I set the lang as ts, which is what I need to build my Vue application.

app.vue

<template>
  <Navigation />
</template>

<script lang="ts">
import Navigation from './components/Navigation'; // This is where I get the error message

export default {
  name: 'app',
  components: {
    Navigation,
  }
}
</script>

Navigation.vue

<template>
  <div id="nav">
    <router-link to="/">Home</router-link>
    <router-link to="/about">About</router-link>
    <router-link to="/categories">Categories</router-link>
    <router-link to="/random">Random</router-link>
  </div>
  <router-view />
</template>

<script lang="ts">
export default {
  name: 'Navigation',
}
</script>
解决方案

In the src folder add the file shims-vue.d.ts with the following content :

Vue 2 :

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

Vue 3:

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

and import the component with its extension .vue :

 import Navigation from './components/Navigation.vue';

instead of :

import Navigation from './components/Navigation';

这篇关于VueJS/Typescript - 找不到模块“./components/Navigation"或其相应的类型声明的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!

08-12 17:14
查看更多