1

即使 VS Code 正确解析了模块，Typescript react app 也不一致地无法导入接口定义。

我使用基于 swagger 规范的 openapi 代码生成器构建了一个带有 create-react-app 的 typescript react 应用程序和一个 REST 客户端。

然后，我在我的应用程序中使用生成的接口定义作为类型定义。

但是，由于某种原因，我始终无法不时导入这些定义。

我已经尝试删除 node_modules 和npm install.

显示问题的文件（ModelProxy.ts）：

import { Model } from '../generated'

生成的模块 index.ts 文件：

export * from './models'

模型模块 index.ts 文件：

export * from './Model'

模型.ts 文件：

export interface Model {...

简化的文件结构：

| src
| - api
| - - proxies
| - - - index.ts
| - - - ModelProxy.ts
| - - generated
| - - - index.ts
| - - - models
| - - - - index.ts
| - - - - Model.ts

我从 React 组件导入 ModelProxy 以进行 api 调用并隔离自动生成的代码。这种模式已经工作了一段时间了。

令我惊讶的是，Visual Studio Code 很好地解析了类型定义。但是，该应用程序不会构建。

构建失败并出现错误：

./src/api/proxies/ModelProxy.ts
Attempted import error: 'Model' is not exported from '../api'.

出于保密原因，我更改了文件名。

4

2 回答 2

1

对于遇到相同问题的任何人，我认为 openapi 代码生成器版本 4.0.0（SNAPSHOT 构建于 2019 年 1 月 11 日）使用命名空间生成打字稿代码以模拟枚举接口内的静态字段，如下所示：

interface Pet {
  status: Pet.StatusEnum
  ...
}

// later in the file ...

export namespace Pet {
  export enum StatusEnum {
    Available = 'available',
    Pending = 'pending',
    Sold = 'sold'
  }
}

这不受 Babel 支持，这是导致错误的原因。

对我来说，解决方法是手动编辑文件以使用不同的名称导出枚举，就像PetStatusEnum在示例中一样，完全放弃命名空间。像这样：

interface Pet {
  status: PetStatusEnum
  ...
}

// later in the file ...

export enum PetStatusEnum {
  Available = 'available',
  Pending = 'pending',
  Sold = 'sold'
}

OpenAPI 维护者正试图在这个问题中解决这个问题。

于 2019-02-07T21:32:26.377 回答
0

我在尝试src从node_modules.

插件@babel/plugin-transform-modules-commonjs帮助了我。

于 2020-02-04T09:59:10.737 回答