typed-document-node.md

id	title
typed-document-node	TypedDocumentNode

{@import ../plugins/client-note.md}

This plugins generates a ready-to-use TypedDocumentNode (a combination of pre-compiled DocumentNode and the TypeScript signature it represents).

For information about the setup and usage of TypedDocumentNode, please refer to the library's documentation.

This plugins requires typescript and typescript-operations as siblings.

Usage example

schema: SCHEMA_FILE_OR_ENDPOINT_HERE
documents: "./src/**/*.graphql"
generates:
  ./src/graphql-operations.ts:
    plugins:
      - typescript
      - typescript-operations
      - typed-document-node

The example about will generate TypedDocumentNode with the needed types built-in, for example:

// Represents the variables type of the operation - generated by `typescript` + `typescript-operations` plugins
export type RatesQueryVariables = Exact<{
  currency: Scalars['String'];
}>;

// Represents the result type of the operation - generated by `typescript` + `typescript-operations` plugins
export type RatesQuery = (
  { __typename?: 'Query' }
  & { rates?: Maybe<Array<Maybe<(
    { __typename?: 'ExchangeRate' }
    & Pick<ExchangeRate, 'currency' | 'rate'>
  )>>> }
);

// Generated by this plugin - creates a pre-compiled `DocumentNode` and passes result type and variables type as generics
export const ratesQuery: TypedDocumentNode<RatesQuery, RatesQueryVariables> = {"kind":"Document","definitions":[{"kind":"OperationDefinition","operation":"query","name":{ ... ]};