前言
在使用 Apollo GraphQL 开发项目时，通常我们需要使用到 apollo-codegen 工具来自动生成 TypeScript 类型定义，这样可以避免手写类型定义时出现错误的情况。然而在 TypeScript 中使用 apollo-codegen 时，因为缺少对应的类型定义，所以会造成一些不便。这时候就需要使用 npm 包 @types/apollo-codegen 来提供 apollo-codegen 的类型定义。
安装
首先需要安装 apollo-codegen：
npm install -g apollo-codegen
然后安装 @types/apollo-codegen：
npm install --save-dev @types/apollo-codegen
使用
在项目中使用 apollo-codegen 时，需要在 tsconfig.json 中配置 @types/apollo-codegen 的路径。
{
"compilerOptions": {
"typeRoots": ["./typings", "./node_modules/@types"],
"types": ["@types/apollo-codegen"]
}
}然后即可在项目中使用 apollo-codegen 了。例如：
-- -------------------- ---- ------- ------ - -------- - ---- ---------------- ------ - ------------------ - ---- --------- ------ ------ ---- ----------------------- ---------- ------- ------ -- ------- -- ------------------- -- ------ ------- ------------- --- --
在上面的例子中，我们导入了 generate 函数和 IntrospectionQuery 类型，然后使用 generate 函数生成 TypeScript 类型定义。需要注意的是，由于 schema 是从本地的 schema.graphql.json 文件中读取的，所以需要类型断言为 IntrospectionQuery 类型，否则编译时会出现类型错误。
结语
通过安装和使用 @types/apollo-codegen，我们可以方便地在 TypeScript 中使用 apollo-codegen 工具，避免手写类型定义时出现错误。在实际开发中，使用自动生成的 TypeScript 类型定义可以提高代码的可维护性和可读性，减少类型相关的错误。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/5eedc162b5cbfe1ea0611da5