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

Question

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?

Answer 1

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;