Unable to load preset matching client

[nikolay-emrikh-stenn]

Which packages are impacted by your issue?

@graphql-codegen/cli

Describe the bug

I try to generate typings using @graphql-codegen/cli (programmatically, using generate function) with client preset error happens: Unable to load preset matching client

✔ Parse Configuration
⚠ Generate outputs
  ✖ Unable to load preset matching client
    Unable to load preset matching 'client'.
    Reason:
    Cannot find package '@graphql-codegen/client' imported from /project-path/node_modules/@graphql-codegen/cli/esm/codegen.js

If you change preset from client to client-preset — everything works fine

Your Example Website or App

—

Steps to Reproduce the Bug or Issue

1. install @graphql-codegen/cli and @graphql-codegen/client-preset both with versions 4.0.1
2. set value of preset field in object under generates field to client:

   generates: {
   'src/__generated__/graphql/': {
   schema: join(projectPath, 'config/graphql/schema.graphql'),
   documents: [`${projectPath}/src/**/*.{ts,tsx}`],
   preset: 'client', // set `client` here
   plugins: [],
   config: {
     strictScalars: true,
     defaultScalarType: 'unknown',
     scalars: {
       Date: 'string',
       DateTime: 'string',
       Decimal: 'number',
       UUID: 'string',
     },
   },
   },
   },

3. try to generate types programmatically using generate function from @graphql-codegen/cli package
4. error Unable to load preset matching client should happen

Expected behavior

Error should not happen if you change preset field from client-preset to client

Screenshots or Videos

No response

Platform

• OS: macOS
• NodeJS: 16.13.2
• graphql version: 16.7.1
• @graphql-codegen/* version(s): 4.0.1

Codegen Config File

import { join } from 'node:path';

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

export const getGraphQLCodegenConfig = (projectPath: string, watch: boolean): CodegenConfig => ({
  watch,
  ignoreNoDocuments: true,
  hooks: {
    afterOneFileWrite: ['eslint --fix'],
  },
  generates: {
    'src/__generated__/graphql/rbf/': {
      schema: join(projectPath, 'config/graphql/schemas/rbf-sales-portal.graphql'),
      documents: [`${projectPath}/src/**/*.rbf.{ts,tsx}`],
      preset: 'client',
      plugins: [],
      config: {
        strictScalars: true,
        defaultScalarType: 'unknown',
        scalars: {
          Date: 'string',
          DateTime: 'string',
          Decimal: 'number',
          UUID: 'string',
        },
      },
    },
  },
});

Additional context

No response

[rokiyama]

I had a similar issue, and it was resolved after I updated @babel/runtime.

The error I encountered was Unable to find preset matching client. At that time, I was using @babel/runtime version 7.4.5, which caused the error:

Cannot find module '@babel/runtime/helpers/objectSpread2'.

I resolved it by installing @babel/runtime version 7.22.5.

[Lonli-Lokli]

It happens with me while I have 7.23.2

[serabakpak]

I resolved it by installing @babel/runtime version 7.22.5.

@rokiyama THANK YOU!!

[Urigo]

Thanks everyone for the reports!

I've labeled the issue according to our new Contribution Guide and issue flow.

It seems already got into stage 0.

Now in order to advance to stage 1 we'll need a simple reproduction, maybe in code-sandbox

@Lonli-Lokli does this still happens to you using latest version? If so, can you please share a reproduction on CodeSandbox or a GitHub repo?

[bdombro]

Here is codesandbox link. Seems to be happening even with a minimal setup.