如何使用VSCode在.vue文件中使用Typescript？

declare module '*.vue' {
  import Vue = require('vue')
  const value: Vue.ComponentOptions
  export default value
}

如果你把这个文件的${Project_ROOT}/typings文件夹,您需要在您的这种类型的文件tsconfig.json一样

"typeRoots": ["./typings"]

然后你可以*.vue用.vue后缀导入文件:

import App from './App.vue'

如果你不喜欢包括.vue后缀,你可以把所有的Vue组件在一个单一的文件夹,例如src/components,改变vue.d.ts为以下几点:

declare module 'src/components/*' {
  import Vue = require('vue')
  const value: Vue.ComponentOptions
  export default value
} 

它src被定义webpack.base.conf.js为绝对路径的别名.

resolve: {
  extensions: ['.js', '.vue', '.json', '.ts'],
  alias: {
    'vue$': 'vue/dist/vue.esm.js',
    'src': resolve('src')
  }
}

然后,您需要使用完整路径导入没有.vue后缀的组件:

import App from 'src/components/App'

两者都不是优雅的解决方案,但红色下划线已经消失.