導入Typescript文件時找不到Vue模塊

Question

我有一個Vue項目，它使用單個文件類組件和Typescript加載器。 我將VS Code與Vetur插件一起使用，以在單個文件.vue組件中獲得非常出色的代碼完成率。 除了在我的entry.ts文件中創建根Vue組件之外，此方法都工作正常：

在entry.ts中，我無法導入vue模塊！

索引

import Vue from 'vue'                       // this is ok
import App from './components/app.vue'      // vue file not found!
new App({el : '#app'})

ERROR Cannot find module './components/app.vue

應用程序

<script lang="ts">
    import Vue from 'vue'                       // this is ok
    import Card from "./card.vue"               // here it works!

    export default class App extends Vue {
    }
</script>

從.vue文件，我可以導入其他.vue模塊。

我嘗試.vue擴展名，但是結果相同。

我嘗試將.vue擴展名添加到.d.ts文件中，但是這弄亂了Vetur插件，並解決了該問題（模塊僅適用於.ts文件，不適用於.vue文件）

Answer 1

嗨，Typescript給您該錯誤，因為它不知道什么是.vue文件。

但是有一個解決方法。

在您的項目目錄中，您可以添加一個名為vue-shims.d.ts的文件。

里面放下面的代碼：

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

現在，打字稿將理解.vue文件。