在 TypeScript 文件中导入 Vue 组件

Question

我一直在尝试将 Vue.js 与 TypeScript 结合使用，并且遇到了 这个 repo 。

我在这里遇到了从 TypeScript 导入 Vue 单一组件文件时出错的问题。我正在使用 Visual Studio 代码。请参阅下面的错误。

主.ts：

 // The Vue build version to load with the 'import' command
// (runtime-only or standalone) has been set in webpack.base.conf with an alias.
import * as Vue from 'vue'
import App from './App'

/* eslint-disable no-new */
new Vue({
    el: '#app',
    template: '<App/>',
    components: { App }
})

VS代码错误：

 1 ERROR
• main.ts
[ts] Cannot find module './App'. (4 17)

原文由 Kapil Garg 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 1

来自 Alex Jover ：

如果您的编辑器在 import App from ‘./App’ in main.js 文件中大喊找不到 App 模块，您可以将 vue-shim.d.ts 文件添加到您的项目中，其中包含以下内容：

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

和写 ：

 import App from './App.vue'

代替

import App from './App'

原文由 arnaud ruant 发布，翻译遵循 CC BY-SA 4.0 许可协议