aws-amplify / aws-amplify/amplify-codegen

Generated queries in TypeScript do not compile with ESM

Open
#740 2 comments 1 reaction 0 assignees View on GitHub
bug
Dominant language
TypeScript
Stars
59
Forks
64
PR merge metrics
No merged PRs in 30d

Description

### Before opening, please confirm:

- [X] I have installed the latest version of the Amplify CLI (see above), and confirmed that the issue still persists.
- [X] I have [searched for duplicate or closed issues](https://github.com/aws-amplify/amplify-codegen/issues?q=is%3Aissue+).
- [X] I have read the guide for [submitting bug reports](https://github.com/aws-amplify/amplify-codegen/blob/main/CONTRIBUTING.md#bugs).
- [X] I have done my best to include a minimal, self-contained set of instructions for consistently reproducing the issue.

### How did you install the Amplify CLI?

npm

### If applicable, what version of Node.js are you using?

v18.8.0

### Amplify CLI Version

12.6.0

### What operating system are you using?

Mac

### Amplify Codegen Command

codegen statements

### Describe the bug

When generating GraphQL queries with TypeScript the types import does not use correct module resolution for ESM.

```
src/graphql/mutations.ts:5:27 - error TS2835: Relative import paths need explicit file extensions in EcmaScript imports when '--moduleResolution' is 'node16' or 'nodenext'. Did you mean '../API.js'?

5 import * as APITypes from "../API";
~~~~~~~~

src/graphql/queries.ts:5:27 - error TS2835: Relative import paths need explicit file extensions in EcmaScript imports when '--moduleResolution' is 'node16' or 'nodenext'. Did you mean '../API.js'?

5 import * as APITypes from "../API";
~~~~~~~~

src/graphql/subscriptions.ts:5:27 - error TS2835: Relative import paths need explicit file extensions in EcmaScript imports when '--moduleResolution' is 'node16' or 'nodenext'. Did you mean '../API.js'?

5 import * as APITypes from "../API";
~~~~~~~~
```

See for additional details: https://github.com/dpilch/codegen-esm-error

### Expected behavior

The imports should have `.js` when using ESM.

### Reproduction steps

See sample app here: https://github.com/dpilch/codegen-esm-error

### GraphQL schema(s)

Any GraphQL schema will have this issue.

### Log output

```
# Put your logs below this line
src/graphql/mutations.ts:5:27 - error TS2835: Relative import paths need explicit file extensions in EcmaScript imports when '--moduleResolution' is 'node16' or 'nodenext'. Did you mean '../API.js'?

5 import * as APITypes from "../API";
~~~~~~~~

src/graphql/queries.ts:5:27 - error TS2835: Relative import paths need explicit file extensions in EcmaScript imports when '--moduleResolution' is 'node16' or 'nodenext'. Did you mean '../API.js'?

5 import * as APITypes from "../API";
~~~~~~~~

src/graphql/subscriptions.ts:5:27 - error TS2835: Relative import paths need explicit file extensions in EcmaScript imports when '--moduleResolution' is 'node16' or 'nodenext'. Did you mean '../API.js'?

5 import * as APITypes from "../API";
~~~~~~~~

```

### Additional information

We will likely need to add a new codegen configuration for this option (such as `moduleResolution`).

Contributor guide

Open the contributing guide

Assessment

This issue has not been assessed yet.

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.