Setting Up GraphQL Code Generator
Explore how to integrate GraphQL Code Generator in your React project with Apollo Client. Learn to install the CLI, configure settings like schema location and plugins, and generate TypeScript files to streamline GraphQL operations and maintain type safety.
Adding GraphQL Code Generator to dependencies
The GraphQL Code Generator maintainers have provided us with a package that helps us get started quickly. This package is called graphql-codegen/cli. Let’s add the @graphql-codegen/cli package to our client application with the following command:
yarn add -D @graphql-codegen/cli
Alternatively, we can manually add the @graphql-codegen/cli package to our package.json file under devDependencies:
"@graphql-codegen/cli": "2.3.0"
Running yarn install inside the application’s directory will install this package.
Configuring GraphQL Code Generator
This @graphql-codegen/cli package gives us a new command to use called graphql-codegen. We will run it to set up the GraphQL Code Generator. We can run the following command in the shell:
yarn graphql-codegen init
The installation will prompt us to answer a few questions, with some defaults selected for us.
The first question is: ...