1

I tried to set up codegen for my react, I use customized schema load to load schema from my api endpoint, but each time got error

Failed to load schema from pulse-api:
Failed to load custom loader: codegen_schema_loader.js
Error: Failed to load custom loader: codegen_schema_loader.js

Here is my codegen config file (codegen.ts)

import type { CodegenConfig } from '@graphql-codegen/cli';

const config: CodegenConfig = {
  overwrite: true,
  schema: [{
    'pulse-api': {
      loader: './codegen_schema_loader.js',
      assumeValidSDL: true,
    }
  }],
  documents: 'src/adapters/worktango/queries/*.graphql',
  generates: {
    'src/gql/': {
      preset: 'client',
      plugins: ['typescript', 'typescript-operations', 'typescript-react-apollo'],
    },
    './graphql.schema.json': {
      plugins: ["introspection"]
    }
  },
  require: ['ts-node/register'],
};

export default config;

Here is custom schema loader (codegen_schema_loader.js), locate at same folder with config file

import { buildClientSchema, getIntrospectionQuery } from "graphql";
import { graphqlUrl } from "./src/config/settings/worktango.settings";
import fetch from 'cross-fetch'
import { tokens } from "./src/adapters";

export default async () => {
  const introspectionQuery = getIntrospectionQuery()
  const authToken = await tokens.getAccessToken();

  const response = await fetch(graphqlUrl, {
    method: 'POST',
    headers: {
      'Content-Type': 'application/json',
      'Access-Token': authToken
    },
    body: JSON.stringify({ query: introspectionQuery })
  })

  const data = await response.json()

  return buildClientSchema(data.data)
}

I dia a debug analysis on codegen process, and found in following function loader return null which should not. Looks like a bug, but I am not sure, does anyone know how to fix this?

async function useCustomLoader(loaderPointer, cwd) {
    let loader;
    if (typeof loaderPointer === 'string') {
        loader = await getCustomLoaderByPath(loaderPointer, cwd);
    }
    else if (typeof loaderPointer === 'function') {
        loader = loaderPointer;
    }
    if (typeof loader !== 'function') {
        throw new Error(`Failed to load custom loader: ${loaderPointer}`);
    }
    return loader;
}

1 Answers1

0

I had the same issue. If you look at that useCustomLoader function loaderPointer can be a function. I changed my codegen.ts file to use my loader function directly and it works now. Definitely seems like a bug.

Change your codegen.ts to something like this

import loader from './codegen_schema_loader.js'

const config: CodegenConfig = {
  ...
  schema: [{
    'pulse-api': {
      loader,
      assumeValidSDL: true,
    }
  }],
  ...
};
MichaelD
  • 54
  • 1
  • 4