为 graphql-codegen 生成子类型

Question

我正在使用库中的打字稿操作graphql-codegen。但我来自 Apollo 已弃用的代码生成器，并且很喜欢它们导出类型的方式。

对于这样的查询

query MyData {
  viewer {
    id
    username
  }
}

我将从 apollo-tooling codegen 中得到这个：

query MyData {
  viewer {
    id
    username
  }
}

但在 graphql-codegen 中我得到了这个：

export type MyDataQuery_viewer = {
  __typename: 'Viewer';
  id: number;
  username: string;
}
export type MyDataQuery = {
  __typename: 'Query',
  viewer?: MyDataQuery_viewer;
}

是否存在任何配置graphql-codegen可以为我提供所有嵌套对象的类型，而不是在单个类型中定义所有内容？

Answer 1

graphql-codegen 默认情况下会为片段生成单独的类型，这就是我解决这个问题的方法：

fragment ViewerFields on Viewer {
  id
  username
}

query MyData {
  viewer {
    ...ViewerFields
  }
}

会生成

export type ViewerFieldsFragment = {
  __typename: 'Viewer';
  id: number;
  username: string;
}

export type MyDataQuery = {
  __typename: 'Query',
  viewer?: {
    __typename: 'Viewer';
    id: number;
    username: string;
  }
}

您可以ViewerFieldsFragment在代码中使用。Fragment如果需要，您可以使用插件的omitOperationSuffix配置选项operations（typescript-operations插件在幕后使用）更改后缀。