【问题标题】:Typescript cannot find module `./app` or its corresponding type declarations ts(2307)Typescript 找不到模块 `./app` 或其对应的类型声明 ts(2307)
【发布时间】:2022-01-08 22:29:10
【问题描述】:

Typescript 在src/main.ts 的 VSCode 中显示以下错误,但是当我运行该项目时,它运行良好,没有错误或警告。

我的tsconfig文件如下:

{
    "compilerOptions": {
        "outDir": "dist",
        "target": "esnext",
        "module": "esnext",
        "moduleResolution": "node",
        "strict": true,
        "jsx": "preserve",
        "sourceMap": true,
        "resolveJsonModule": true,
        "esModuleInterop": true,
        "lib": ["esnext", "dom"],
        "baseUrl": "src",
        "allowJs": true,
        "paths": {
            "@/*": ["./*"],
            "~/*": ["./*"]
        },
        "suppressImplicitAnyIndexErrors": true
    },
    "include": ["src/**/*.ts", "src/**/*.d.ts", "src/**/*.tsx", "src/**/*.vue"],
    "exclude": ["node_modules", "dist"]
}

App.vuesrc/App.vue中找到,文件内容如下

<template>
    <div>
        <!-- <h1 v-if="showModal">HELLO WORLDDNIOAS</h1> -->
        <!-- <SignInModal :show-modal="showModal" /> -->
        <HomePage />
        <!-- <router-view></router-view> -->
    </div>
</template>

<script lang="ts">
import { defineComponent, computed, ref } from "vue";
import HomePage from "@/components/HomePage.vue";
import SignInModal from "@/components/SignInModal.vue";
import Test from "@/components/Test.vue";
import { useStore } from "vuex";

export default defineComponent({
    name: "App",
    components: {
        HomePage,
        SignInModal,
        Test,
    },
    setup() {
        const store = useStore();
        const hello = ref(false);
        return {
            showModal: computed<boolean>(
                () => store.getters["modal/showModal"]
            ),
            hello,
        };
    },
});
</script>

<style>
#app {
    font-family: Avenir, Helvetica, Arial, sans-serif;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-align: center;
}
</style>

我在shims-vue.d.ts 中也有如下类型定义:

import Vue, { DefineComponent } from "vue";
declare module "*.vue" {
    //eslint-disable-next-line @typescript-eslint/no-explicit-any, @typescript-eslint/ban-types
    const component: DefineComponent<{}, {}, any>;
    export { component, Vue };
}

如前所述,应用程序在控制台中加载正常且没有错误,App.vue 显示正确。为什么 VSCode 给我这个错误?

【问题讨论】:

    标签: typescript vue.js vuejs3 vite


    【解决方案1】:

    Vue 3 没有导出Vue 对象,正确的模块声明如下:

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

    【讨论】:

      猜你喜欢
      • 2021-10-16
      • 2022-11-10
      • 2020-12-08
      • 2021-05-10
      • 2021-09-21
      • 2021-02-20
      • 2021-03-17
      • 2021-08-27
      • 2021-01-19
      相关资源
      最近更新 更多