Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

GraphQL Codegen does not work with ES Modules #1738

Open
Hexatare opened this issue Nov 7, 2024 · 1 comment
Open

GraphQL Codegen does not work with ES Modules #1738

Hexatare opened this issue Nov 7, 2024 · 1 comment

Comments

@Hexatare
Copy link

Hexatare commented Nov 7, 2024

Issue summary

The GraphQL Codegen creates two files: admin.types.d.ts and admin.generated.d.ts. The codegen preset automatically adds an import statement at the top of the admin.generated.d.ts file to include the required base types. However, when using "type": "module" in the package.json, the import statement is invalid because you are required to specify the .js file extension. There is currently no way to configure this behavior to allow the codegen to generate the correct import path with the .js extension. This means that I have to manually update the generated files after each codegen run or copy the code from the repository.

Expected behavior

There should either be an option to update the import or the codegen should detect when it is used inside an ESM module.

Actual behavior

The import statement in the generated admin.generated.d.ts file does not include the required .js extension when using "type": "module" in package.json, resulting in an invalid import. This forces developers to either manually edit the file after each codegen run or maintain a custom codegen setup.

Steps to reproduce the problem

  1. Set "type": "module" in package.json.
  2. Run the GraphQL codegen.
  3. Inspect the generated admin.generated.d.ts file.
  4. Notice the incorrect import statement that doesn't include the .js extension, causing issues when trying to import from admin.types.

Debug logs

The generated output looks like this:

/* eslint-disable eslint-comments/disable-enable-pair */
/* eslint-disable eslint-comments/no-unlimited-disable */
/* eslint-disable */
import type * as AdminTypes from './admin.types';

...
@lizkenyon
Copy link
Contributor

Thank you for flagging the team will look into this.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants