GraphQL codegen helps us to write queries, mutations, fragments and using hooks which are already typed.
read more about it
Assuming you already have urql , graphQL and typescript installed and setup in your project, (I am working on next.js project)
here is how you can install and use graphql codegen for typed variables throughout your project.
Installation
yarn add -D @graphql-codegen/typescript-urql
Add codegen CLI
yarn add -D @graphql-codegen/cli
Initialize codegen configuration
yarn run graphql-codegen init
This command will generate codegen configuration for you by asking for selecting your graphql endpoint, location of your graphql operation in the project, folder to write the output of codegen, script to run graphql codegen etc. You can also manually create the codegen.ts file and write the configuration there.
Use your graphQL api endpoint as schema.
read more about config
Run
Run yarn install and the script you have set up to run codegen.
Eg. yarn run codegen
To run in watchmode,
yarn run codegen --watch
Top comments (0)