[BUG] Maximum call stack size exceeded

[mikevoets]

Describe the bug
I keep running into Maximum call stack size exceeded when trying to migrate with @eddeee888/gcg-operation-location-migration.

To Reproduce

I have the following generated files:

import * as Types from '../../graphql/types';

import { gql } from '@apollo/client';
import * as Apollo from '@apollo/client';
...

This is my codegen.ts originally:

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

const config: CodegenConfig = {
  // schema.json describes our entire graphql schema,
  // and will also live at the root of the project
  // we can git ignore this as it won't be needed in production
  schema: 'schema.json',

  // look in the app/webpack directory for all the .graphql extension files
  documents: ['./app/webpack/**/*.graphql'],
  generates: {
    // will generate a types file with all of our graphql types defined
    // other generated files will import from this
    './app/webpack/graphql/types.ts': {
      plugins: ['typescript'],
      config: {
        // puts all generated components in a Types namespace
        importTypesNamespace: 'Types',
        // Add this line to generate fragment types in the same directory
        fragmentMasking: false,
      },
    },

    // for everything else, have a .generated.ts extension and
    // use the same directory as the .graphql file
    // Uses the typescript-react-apollo plugin to generate
    // React Apollo hooks.
    './app/webpack/': {
      preset: 'near-operation-file',
      presetConfig: {
        extension: '.generated.ts',
        baseTypesPath: 'graphql/types.ts',
      },
      plugins: ['typescript-operations', 'typescript-react-apollo'],
      config: {
        // Configures the plugin to generate hooks (withHooks: true),
        // but not higher-order components (withHOC: false) or
        // React components (withComponent: false).
        // Imports operation types from the Types namespace.
        withHooks: true,
        withHOC: false,
        withComponent: false,
        avoidUnusedTypes: true,
      },
    },
  },
};

export default config;

With the codemod:

import { defineConfig } from '@eddeee888/gcg-operation-location-migration';
import type { CodegenConfig } from '@graphql-codegen/cli';

const config: CodegenConfig = {
  // schema.json describes our entire graphql schema,
  schema: 'schema.json',

  // look in the app/webpack directory for all the .graphql extension files
  documents: './app/webpack/**/*.graphql',
  generates: {
    'app/webpack/': defineConfig({
      tsConfigFilePath: './tsconfig.json',
      targetStyle: 'near-operation-file',
      gqlTag: {
        name: 'gql',
        importFrom: '@apollo/client',
        importType: 'absolute',
      },
      hooksImportFrom: '@apollo/client',
    }),
  },
};

I wasn't entirely sure about the importFrom and importType and name values for gqlTag. I tried to use gqlTag: { name: 'graphql', importFrom: './gql', importType: 'relative' } to no avail, same result.

Expected behavior
I expect the migration files to be created.

Screenshots
When running yarn graphql-codegen --config codegen.ts:

Versions

• OS: MacOS
• OS Version:
• Package name and version:
  • "@eddeee888/gcg-operation-location-migration": "^0.1.0",
  • "@apollo/client": "^3.10.3",
  • "@graphql-codegen/cli": "^5.0.7",
  • "@graphql-codegen/import-types-preset": "^3.0.1",
  • "@graphql-codegen/near-operation-file-preset": "^3.1.0",
  • "@graphql-codegen/typescript": "^5.0.0",
  • "@graphql-codegen/typescript-operations": "^5.0.0",
  • "@graphql-codegen/typescript-react-apollo": "^4.3.3",

Additional context
Add any other context about the problem here.

[eddeee888]

Hi @mikevoets ,

Apologies I couldn't get to this earlier.

The Maximum call stack size exceeded could mean there's a bad recursion or too many files for the process to handle.

Would it be possible to share:

• the rough number of .ts files you have in your tsconfig.json's include option?
• the number of .graphql files?

Here's a few thoughts/workaround I could think of:

• Try targeting less documents to start with e.g. documents: ['./app/webpack/path-to-one/document.graphql'],, then increase the number or use glob patterns to eventually run through all the documents
• If reducing the number of documents to only one still results in the same error, most like there's a scenario the codemod is not considering.
  • If this is the case, please try running the command with the verbose flag e.g. yarn graphql-codegen --verbose to see if it gives any hints
  • If you are able to reproduce this by creating a small repo using GitHub, Stackblitz or CodeSandbox, it'd help me understand the issue a lot more
  • Alternatively, if your project is open source, I'm more than happy to check it out and try

[mikevoets]

Thank you @eddeee888. I managed to create a special tsconfig.json that includes much fewer files. For what it's worth, I also had to increase heap size to run the script (NODE_OPTIONS="--max-old-space-size=8192") and upgrade to graphql v16.

Closing this because I was able to work around it with your excellent help.