我已经在 Typescript 中创建了一个 Rest API 应用程序,使用 NestJS 并使用 Apollo Client 查询 GraphQL 服务器。我目前对我的查询进行了硬编码,如下所示:const query = \'query { ex...
我已经在 Typescript 中创建了一个 Rest API 应用程序,使用 NestJS 并使用 Apollo Client 查询 GraphQL 服务器。
我目前的查询是硬编码的,如下所示:
const query = "query { example }";
this.apolloClient.query({
query: gql`
${query}
`,
});
但我想将这些查询移动到 .grapql
文件中并在查询中使用它们 DocumentNode
.
例子.graphql
query {
example
}
import example from "example.graphql";
this.apolloClient.query({
query: example,
});
我能得到一些帮助吗,关于我需要做什么才能得到这个?
我尝试 graphql.d.ts
用如下代码创建一个文件:
declare module "*.graphql" {
import { DocumentNode } from "graphql";
const value: DocumentNode;
export default value;
}
但我一直收到 Cannot find module "example.graphql" or its corresponding type declarations
错误。
import example from "example.graphql";
~~~~~~~~~~~~~~~~~
您不应该导入 .grapql 文件,而是应该导入依赖于这些 .grapql 文件的自动生成的钩子。
我将为你提供一些指导,但你必须将其运用到你的案例中。
npm install @nestjs/graphql graphql-tools graphql apollo-server-express @graphql-codegen/cli @graphql-codegen/typescript @graphql-codegen/typescript-resolvers
import { Module } from '@nestjs/common';
import { GraphQLModule } from '@nestjs/graphql';
import { ApolloDriver, ApolloDriverConfig } from '@nestjs/apollo';
import { join } from 'path';
@Module({
imports: [
GraphQLModule.forRoot<ApolloDriverConfig>({
driver: ApolloDriver,
autoSchemaFile: join(process.cwd(), 'src/schema.gql'), // auto-generate schema file
}),
],
})
export class AppModule {}
type Query {
hello: String!
}
overwrite: true
schema: "src/schema.graphql"
generates:
src/graphql.ts:
plugins:
- "typescript"
- "typescript-resolvers"
{
"scripts": {
"generate": "graphql-codegen"
}
}
npm 运行生成
在 codegen.yml 定义输出,在本例中是 src/graphql.ts
然后在生成完成后, 你可以导入生成的钩子 ,当你对 .graphl 文件进行一些修改时,你需要 再次 npm run generate
希望这可以给你一些指导( https://the-guild.dev/graphql/codegen/docs/getting-started )。