TypeScript Nhost

Package nameWeekly DownloadsVersionLicenseUpdated
@graphql-codegen/typescript-nhostDownloadsVersionLicenseApr 19th, 2026

Installation

npm i -D @graphql-codegen/typescript-nhost
⚠️

Usage Requirements In order to use this GraphQL Codegen plugin, please make sure that you have GraphQL operations (query / mutation / subscription and fragment) set as documents: … in your codegen.yml.

Without loading your GraphQL operations (query, mutation, subscription and fragment), you won’t see any change in the generated output.

This plugin generates the Typescript schema that enables queries and mutations to be typed in the Nhost SDK.

Config API Reference

scalars

type: “

This plugin generates the schema for the Typescript Nhost SDK.

codegen.ts
import type { CodegenConfig } from '@graphql-codegen/cli'
 
const config: CodegenConfig = {
  schema: 'http://localhost:4000',
  generates: {
    'src/schema.ts': { plugins: ['typescript-nhost'] }
  }
}
export default config

Usage

Step 1: Generate the schema

First, install GraphQL codegen and the Nhost Typescript plugin:

npm i --save-dev @graphql-codegen/cli @graphql-codegen/typescript-nhost

Then configure the code generator by adding a codegen.yaml file:

codegen.yaml
schema:
  - http://localhost:1337/v1/graphql:
      headers:
        x-hasura-admin-secret: nhost-admin-secret
generates:
  ./src/schema.ts:
    plugins:
      - typescript-nhost

Step 2: Install and configure the Nhost Typescript SDK

npm i --save @nhost/nhost-js
src/main.ts
import { NhostClient } from '@nhost/nhost-js'
import schema from './schema'
 
const nhost = new NhostClient({ subdomain: 'localhost', schema })

A GraphQL query named todos will then be accessible through:

const todos = await nhost.graphql.query.todos({ select: { contents: true } })

The todos object will be strongly typed based on the GraphQL schema, and the fields that would have been selected in the query.

Custom scalars

It is possible to customize the scalar types in adapting the configuration file. The following example illustrates how to specify some Hasura scalars. The @graphql-codegen/add plugin is necessary to be able to add the definition of the JSONValue type.

codegen.yaml
schema:
  - http://localhost:1337/v1/graphql:
      headers:
        x-hasura-admin-secret: nhost-admin-secret
generates:
  ./src/schema.ts:
    plugins:
      - typescript-nhost
      - add:
          content:
            'export type JSONValue = string | number | boolean | { [x: string]: JSONValue } |
            Array<JSONValue>;'
    config:
      scalars:
        uuid: 'string'
        bigint: 'number'
        citext: 'string'
        timestamptz: 'string'
        json: 'JSONValue'
        jsonb: 'JSONValue'
        bytea: 'string'