解决 TS2614: Module “*.vue“ has no exported member(Vue3+TypeScript)

解决 TS2614: Module "*.vue" has no exported member(Vue3+TypeScript)

  • 问题
  • 解决

问题

最近使用TS+Vue3.2写项目时碰到个问题:
Vue组件中定义了一个接口并导出,在另一个TS文件中import这个接口,报TS2614的错误。在其他Vue组件中导入则不会报错。

<script setup lang="ts">
//vue组件中的接口定义
export interface IProps {
    description: string
}
script>
//TS文件中导入
import type { IProps } from '@/components/*.vue'

环境:
WebStorm 2021.3 / Vue 3.2 / TypeScript 4.1.5
报错:
TS2614: Module '"*.vue"' has no exported member 'IProps'. Did you mean to use 'import IProps from "*.vue"' instead?

离谱的是,即便我恢复到上次正常运行时的代码,重新npm install也救不回来。写代码果然是门玄学。

解决

自己摸索和搜索了些解决方案,包括重新npm install、升级TS版本、更改文件格式、更改接口类型表示等,都没有用。
受这个问题启发,我尝试把接口放到一个单独的TS文件中,在用到的地方调用这个接口。这确实解决了这个问题,不再报错。
据其他一些回答说,Vue的最新VSCode插件已经解决了这个问题,但因为我主要使用WS,也就没有尝试。
也看到其他一些方案,对我来说,单独把接口放到一个TS文件中是代价最小的解决方案。虽然对于我的项目来说,这样的做法有些奇怪。
不知道后面会不会有官方的解决方案。

你可能感兴趣的:(typescript,vue.js,javascript)