时间戳

首页 > 解决方案 > 如何获取带有变量的graphql查询标签的打字稿定义？

typescript - 如何获取带有变量的graphql查询标签的打字稿定义？

问题描述

我正在尝试通过 apollo-cli ( https://github.com/apollographql/apollo-tooling#apollo-clientcodegen-output ) 为我的 graphql 标记查询生成打字稿定义。并且它们不会为${}模板字符串中包含变量的查询生成。有什么办法让它工作吗？

对于标记功能，我使用的是自定义模块（gqutils）。我已经$gql.tag在选项中设置了标签。它成功地为查询生成类型，其中没有任何变量。

我尝试寻找一种方法来提供自定义解析器，这样我就可以执行模板字符串并获取原始值。是否有任何与apollo 客户端中的自定义文档加载器等效的东西。

这是代码片段：

const docType = {
    PRODUCT: 'Product',
};

const query = $gql.tag`
  query searchProducts (
    $categoryId: IntID,
  ){
    searchProducts(categoryId: $categoryId, docType: ${docType.PRODUCT}) {
      totalCount
      nodes {
        id,
        name,
      }
  }`;

apollocli 不会产生任何错误，只是默默地忽略类型输出中的文件。

标签： typescriptgraphqlapolloapollo-client

解决方案

我猜，因为 Apollo-cli 从 GraphQL 模式生成类型，并且您在其中放入了一个变量，它不会转换docType: ${docType.PRODUCT}为无法解析的 graphql 类型。如果 doctype 是 graphql 枚举，则不需要为其创建特定的字符串对象。

考虑一下：

""" graphql schema enum """
enum DocTypes {
PRODUCT
...
}

// the frontend query
const query = gql `
  query searchProducts (
    $categoryId: IntID,
    $docType: DocTypes
  ){
    searchProducts(categoryId: $categoryId, docType: $docType) {
      totalCount
      nodes {
        id,
        name,
      }
  }
`

在上面的查询中，您可以将 docType 枚举放入查询变量中。

当 apollo CLI 现在运行时，它也会从 graphql 模式枚举中在前端生成所需的枚举。

作为一般的经验法则，我建议不要将计算值放在你的 graphql 查询字符串中，因为这些对于任何 graphql 集成工具都很难解析。

推荐阅读