dotansimha / dotansimha/graphql-code-generator

Generate type annotations to prevent error TS2742: A type annotation is necessary

Open
#8,133 5 comments 4 reactions 0 assignees View on GitHub
core
Dominant language
TypeScript
Stars
11.3k
Forks
1.4k
Avg merge
1d 1h
Merged PRs (30d)
23

Description

**Is your feature request related to a problem? Please describe.**

I am generating code using `@graphql-codegen/typescript-operations`. The generated code looks like this:

```ts
export const ProductDeleteDocument = gql`
mutation ProductDelete($productId: ID!) {
productDelete(input: { id: $productId }) {
deletedProductId
}
}
`;
```

When I want to use this code inside another package of my monorepo (using [Turborepo](https://turborepo.org/)) then I am getting the following error:

> error TS2742: The inferred type of ‘ProductDeleteDocument‘ cannot be named without a reference to ‘graphql-tag/node_modules/graphql/language/ast‘. This is likely not portable. A type annotation is necessary.

I then have to manually annotate the type for `ProductDeleteDocument`:

```ts
import {DocumentNode} from 'graphql';

export const ProductDeleteDocument: DocumentNode = gql`
mutation ProductDelete($productId: ID!) {
productDelete(input: { id: $productId }) {
deletedProductId
}
}
`;
```

However, this will be overwritten with the next execution of `graphql-codegen`. Is there a setting / flag that I can use so that `@graphql-codegen/typescript-operations` will generate explicit typings for me?

**Describe the solution you'd like**

I would like to use a setting in my `.graphqlrc.json` which generates explicit annotations for constants and their return values.

**Describe alternatives you've considered**

I can only fix the problem by manually editing the generated code.

**Additional context**

My `.graphqlrc.json` file looks like this:

```json
{
"schema": [
{
"${SHOPIFY_ADMIN_API_URL}": {
"headers": {
"X-Shopify-Access-Token": "${SHOPIFY_ADMIN_ACCESS_TOKEN}"
}
}
}
],
"extensions": {
"codegen": {
"hooks": {
"afterAllFileWrite": [
"prettier --write",
"yarn eslint --fix"
]
},
"generates": {
"src/generated/types/shopify.schema.ts": {
"plugins": [
{
"typescript": {
"skipTypename": true,
"enumsAsTypes": true,
"defaultScalarType": "unknown",
"strictScalars": true
}
}
]
},
"src/generated/sdk.ts": {
"documents": "src/graphql/*",
"preset": "import-types",
"presetConfig": {
"typesPath": "./types/shopify.schema"
},
"plugins": [
{
"typescript-operations": {
"skipTypename": true,
"defaultScalarType": "unknown",
"strictScalars": true
}
},
"typescript-graphql-request"
]
}
}
}
}
}
```

I run code generation by executing: `graphql-codegen -r dotenv/config`

Contributor guide

No contributing guide indexed for this repository

Assessment

This issue has not been assessed yet.

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.