graphqlnext.jsvercelgraphql-codegen

Vercel app with graphql-codegen endpoint error Unable to find any GraphQL type definitions for the following pointers


I load my GraphQL schema like:

const schema = loadSchemaSync('./src/graphql/server/schema/*.gql', {
  loaders: [new GraphQLFileLoader()],
})

This works fine locally, however, when deploying to vercel I get the error:

Unable to find any GraphQL type definitions for the following pointers:
          - ./src/graphql/server/schema/*.gql

I think this is because vercel is dropping the relevant files after build?


Solution

  • The problem is that you cannot use dynamic loaders in Vercel Serverless Functions.

    A workaround for this problem is to use a inline GraphQL schema.

    // src/graphql/schema.ts
    
    import { gql } from "apollo-server-core";
    
    export default gql`
      type Query {
        greet: String!
      }
    `;
    
    
    // src/pages/api/graphql.ts
    
    import { ApolloServerPluginLandingPageGraphQLPlayground } from "apollo-server-core";
    
    import Schema from "../../graphql/schema";
    
    const apolloServer = new ApolloServer({
      typeDefs: Schema,
      resolvers,
      plugins: [ApolloServerPluginLandingPageGraphQLPlayground],
      introspection: true,
    });
    

    If you are using tools like codegen:

    // codegen.ts
    
    import { CodegenConfig } from "@graphql-codegen/cli";
    
    const config: CodegenConfig = {
      schema: "src/graphql/schema.ts",
      documents: ["./src/**/*.{ts,tsx}"],
      ignoreNoDocuments: true,
      generates: {
        "src/graphql/types/server.ts": {
          plugins: [
            "@graphql-codegen/typescript",
            "@graphql-codegen/typescript-resolvers",
          ],
        },
        "src/graphql/types/client/": {
          preset: "client",
          plugins: [],
        },
      },
    };
    
    export default config;