【问题标题】:Vue / Typescript, got Module '"*.vue"' has no exported memberVue / Typescript,得到模块'“*.vue”'没有导出成员
【发布时间】:2019-10-01 06:35:46
【问题描述】:

我想从.vue文件中导出几个接口和Component

基本.vue:

<template>
    <div class="app">
        <router-view></router-view>
    </div>
</template>

<script lang="ts">
import { Vue, Component } from "vue-property-decorator";

export interface IBasic {
    name :string;
}

/**
 * Simplest container
 */
@Component
export class Basic extends Vue {}
export default Basic;
</script>

但是当我从另一个 .ts 文件中导入它时,我得到了:

如何才能成功导入接口?

【问题讨论】:

  • 为什么不将IBasic 移动到它自己的文件中,让任何需要的人都可以导入它?
  • 虽然将它们放入单独的文件中是可行的,但我正在寻找将它们与组件放在一起的可能性。特别是当接口在其他地方无用时。
  • 有关于这个问题的消息吗?目前是否只能将所有导出内容收集到一个默认对象?
  • 看起来 vscode + Vetur@0.34.1 已经解决了这个问题。

标签: typescript vue.js visual-studio-code vuejs2


【解决方案1】:

尝试将interface 移动到另一个 TS 文件中

组件.vue

<template>
    <div class="app">
        <router-view></router-view>
    </div>
</template>
<script lang="ts">
import { Vue, Component } from "vue-property-decorator";
   
/**
 * Simplest container
 */
@Component
export class Basic extends Vue {}
export default Basic;
</script>

interfaces.ts

export interface IBasic {
    name :string;
}

【讨论】:

    【解决方案2】:

    我遇到了同样的问题,并意识到尽管我的 IDE 上没有错误,但仍然抛出错误,所以我只是 重新启动服务器 并且它运行良好......我必须这样做每次我使用 TS 创建导入或导出任何内容时。

    【讨论】:

      【解决方案3】:

      在 VS Code 中使用这个插件为我解决了这个问题: https://github.com/HerringtonDarkholme/vue-ts-plugin

      这是一个积极维护的分叉。我运行了yarn add -D ts-vue-plugin 并将这些编译器选项添加到我的tsconfig.json

      compilerOptions: {
        "allowSyntheticDefaultImports": true,
        "plugins": [{ "name": "ts-vue-plugin" }]
      }
      

      我的代码(故事书 6 文件button.stories.ts):

      import Button, { BUTTON_TYPE } from '@/components/Button.vue';
      

      有了这个,类型导入终于起作用了,我可以跳转到文件(CMD+点击),而不是像以前那样跳转到shims-vue.d.ts。祝你好运!

      【讨论】:

        【解决方案4】:

        您可以从导入中删除 { }。这是一个默认导出,所以你写 import IBasic from "@/../containers/Basic"

        【讨论】:

        • 有一个默认导出,但也有一个名为 IBasic 的名称,这可能是我们想要的。
        • 为什么会这样。它不以任何方式回答问题。
        【解决方案5】:

        您可以尝试使用ktsn/vuetype,而不是为每个组件文件生成自定义声明文件,而不是使用默认的shims-vue.d.ts 声明。

        【讨论】:

        • 这似乎是一个与其他答案不同的实际解决方案,但它似乎有点沉重。有没有办法修改默认的shims-vue.d.ts 声明以接受任意命名的导出。
        猜你喜欢
        • 2021-12-09
        • 2021-10-17
        • 1970-01-01
        • 2021-05-26
        • 2020-09-27
        • 2019-06-04
        • 1970-01-01
        • 2023-02-03
        • 2022-01-21
        相关资源
        最近更新 更多