从 Typescript 项目中的外部文件继承并声明放大生成的类型

Question

我正在 monorepo 中使用 aws-amplify 实现一个打字稿项目。 monorepo 有一个 Web 项目：packages/web 和模型项目，其中包括 graphql 操作和类型：packages/models。在 amplify 中创建我的 graphql 模式后，我在 amplify codegen 到 packages/models/src/graphql/

的帮助下生成操作和类型

到目前为止一切顺利，在 Vue 项目中我可以将操作和类型导入为 import {listOrganizations, ListOrganizationsQuery} from "models";，执行查询，得到结果。当需要在组件中使用动作时，我会再次从模型中导入类型并使用。

我的想法是，是否有一种方法可以从模型项目中导入类型，并将 Web 项目中的所有类型包含在一个 .d.ts 文件中，从而跳过从模型存储库中导入类型.所以每次我生成 graphql 操作和类型时，我希望 web repo 导入类型并在 web 项目中全局声明，以便能够跳过导入类型。

我尝试过的：

在packages/web/src

api.d.ts

从 packages/models/src/graphql/API.ts

我在这里尝试做的是从全局模型中导入和声明所有类型，但我卡在了这一点上。

packages/models/models/src/graphql/API.ts

export type ListOrganizationsQuery = {
  listOrganizations:  {
    __typename: "ModelOrganizationConnection",
    items:  Array< {
      __typename: "Organization",
      id: string,
      name: string,
      externalId: string | null,
      status: OrganizationStatus,
      logo: string,
    } | null > | null,
    nextToken: string | null,
  } | null,
};

packages/web/src/api.d.ts

import "models/src/graphql/API.ts";

VSCode是不识别导入类型，编译器不编译只要我这样做的方式可能不对。有没有办法导入所有类型并全局声明？或者是否有任何其他我应该应用的最佳实践，而不是我尝试过的这种方式？

Answer 1

在尝试了几天不同的解决方法之后，我终于承认了我正在尝试做的事情。全局导入和声明类型的目的是 amplify codegen 正在为查询、突变和订阅创建类型，而不是为模型创建类型。所以我不得不在前端应用程序中重新编写模型，但每次更新 graphql 模式时，我也需要更新前端类型。

我的解决方法是将查询类型从 packages/models 动态导入到我的前端项目中的 declarations.d.ts 中。并在那里声明相似的模型类型。

例子

packages/models/src/graphql/API.ts

export type GetOrganizationQuery = {
  getOrganization:  {
    __typename: "Organization",
    id: string,
    name: string,
    decription: string | null,
    ...

};

packages/web/src/types/declarations.d.ts

declare type TOrganization = import("../path/to/models").GetOrganizationQuery["getOrganization"];

从 Typescript 项目中的外部文件继承并声明放大生成的类型

Inherit and declare amplify generated types from an external file in Typescript project

typescript

graphql

typescript-typings

aws-amplify

monorepo