GraphQL Code Generator 对 Apollo skipToken 的支持现状分析

背景介绍

GraphQL Code Generator 是一个强大的工具链，能够根据 GraphQL schema 自动生成类型安全的代码。在 React 与 Apollo Client 结合使用时，它能够生成类型化的查询钩子，极大提升了开发体验。

问题核心

随着 Apollo Client 的发展，其 Suspense 模式下的查询方式也在演进。传统的 skip 选项即将被废弃，取而代之的是更类型安全的 skipToken 技术。这一变化对使用 GraphQL Code Generator 生成的代码产生了影响。

skipToken 的优势

1. 类型安全性增强：skipToken 提供了比 skip 选项更好的类型检查
2. 明确的跳过意图：通过使用特殊标记而非布尔值，代码意图更加清晰
3. 未来兼容性：Apollo 官方明确表示这是未来的推荐方式

当前解决方案

目前，开发者可以绕过自动生成的钩子，直接使用 Apollo Client 的原始钩子：

import { useSuspenseQuery, skipToken } from '@apollo/client'
import { ExampleQueryResult, ExampleQueryDocument } from './generated'

const { data } = useSuspenseQuery<ExampleQueryResult>(
    ExampleQueryDocument,
    id ? { variables: { id } } : skipToken
)

这种方式虽然可行，但失去了 GraphQL Code Generator 提供的便利性。

理想实现

社区期望 GraphQL Code Generator 能够原生支持 skipToken，生成如下形式的代码：

import { skipToken } from '@apollo/client'
import { useExampleSuspenseQuery } from './generated'

const { data } = useExampleSuspenseQuery(id ? { variables: { id } } : skipToken)

这种实现方式既保持了类型安全，又充分利用了代码生成器的便利性。

技术实现考量

要实现这一功能，代码生成器需要：

1. 识别 Suspense 模式的查询钩子
2. 修改生成的类型定义以支持 skipToken 作为有效参数
3. 确保生成的代码与 Apollo Client 的最新版本兼容
4. 维护向后兼容性，不影响现有代码

开发者建议

对于急需此功能的开发者，建议：

1. 暂时使用直接调用 Apollo Client 钩子的方式
2. 关注社区插件的更新进展
3. 在项目中进行适当的抽象，便于未来迁移

总结

GraphQL Code Generator 对 Apollo skipToken 的完整支持是类型安全 GraphQL 开发的重要一环。虽然目前需要一些变通方案，但随着社区的推动，这一功能有望在未来的版本中得到原生支持。开发者应关注这一演进，为未来的升级做好准备。