require field

The require field allows you to load any external files without the need to transpile them before.

How to use it?

To use it, install the extensions you wish to use from npm and then specify a list of require extensions in your root config:

import { CodegenConfig } from '@graphql-codegen/cli'
 
const config: CodegenConfig = {
  // ...
  require: ['extension1', 'extension2']
  // ...
}
export default config

Adding require extension is useful if you are loading your GraphQLSchema or GraphQL documents from a code file, if you wish to use custom plugins, or use a custom schema loader or a custom document loader.

TypeScript Support

If you wish to use TypeScript, just add ts-node (opens in a new tab) from npm and specify its register export in your config file:

import { CodegenConfig } from '@graphql-codegen/cli'
 
const config: CodegenConfig = {
  // ...
  require: ['ts-node/register']
  // ...
}
export default config

Specifying from the command line

You can also specify require.extensions as a CLI flag using -r.

Specifying the -r CLI flag will load your require.extension before loading the .yml file.

This way, you can load environment variables using dotenv and use those environment variables in your .yml config file.

dotenv Integration

If you wish to use dotenv (opens in a new tab) to load environment variables, you can install dotenv from npm and then use the require CLI flag: -r dotenv/config.

It will make sure to load your .env file before executing the codegen and loading your .yml file, so environment variables used in your config file will be replaced with the correct value.

To get started with this integration, make sure you have .env file with variables, dotenv installed, and codegen is being executed like that:

graphql-codegen --require dotenv/config --config codegen.ts

Customize loaded env file

If you wish to load a file different than .env file, please follow dotenv library documentation (opens in a new tab).

It allows you to specify a custom file path using 2 methods.

You can either set an environment variable called DOTENV_CONFIG_PATH with the path:

DOTENV_CONFIG_PATH="./my.env" graphql-codegen --require dotenv/config --config codegen.ts

Or, you can specify it using codegen CLI, like that:

graphql-codegen --require dotenv/config --config codegen.ts dotenv_config_path=my.env

dotenv Example

SCHEMAURL=https://example.com/graphql
APIKEY=ABC123

import { CodegenConfig } from '@graphql-codegen/cli'
 
const config: CodegenConfig = {
  schema: {
    [process.env.SCHEMAURL]: {
      headers: {
        apikey: process.env.APIKEY
      }
    }
  }
  // ...
}
 
export default config