From e5be6a417f3ba74bca9ba86bf2e02393bfe46977 Mon Sep 17 00:00:00 2001 From: Lennart Date: Fri, 3 Jun 2022 11:36:44 +0200 Subject: [PATCH] website: Update Gatsby's guide --- website/docs/integrations/gatsby.mdx | 31 +++------------------------- 1 file changed, 3 insertions(+), 28 deletions(-) diff --git a/website/docs/integrations/gatsby.mdx b/website/docs/integrations/gatsby.mdx index dcbb0aa0b6d..45a64e3b4e3 100644 --- a/website/docs/integrations/gatsby.mdx +++ b/website/docs/integrations/gatsby.mdx @@ -3,37 +3,12 @@ id: gatsby title: Gatsby --- -If you build apps using [Gatsby](https://gatsbyjs.com), you can use GraphQL Code Generator to generate TypeScript types. +If you build apps using [Gatsby](https://gatsbyjs.com), you can use its built-in feature called [GraphQL Typegen](https://www.gatsbyjs.com/docs/how-to/local-development/graphql-typegen/). Under the hood it uses the GraphQL Code Generator to generate TypeScript types but you don't need to set anything up other than enabling an option. -The codegen knows automatically to look for the import of the `graphql` tag for `gatsby` package. - -Using the following config file should cover everything specific to Gatsby: - -```yaml -schema: http://localhost:8000/___graphql -documents: - - ./src/**/*.{ts,tsx} - - ./node_modules/gatsby*/!(node_modules)/**/*.js -generates: - ./src/graphqlTypes.ts: - plugins: - - typescript - - typescript-operations -``` - -Now, the codegen should load your GraphQL operations from your source code and load all the internal fragments from `node_modules`. - - -The glob expression above should get you started quickly, but note that it's vast and might load many files that match the `./node_modules/gatsby*/!(node_modules)/**/*.js` pattern. -If you are having issues with this glob expression, or if you see performance issues, please note that you need to narrow this expression to the bare minimum that is being loaded by your Gatsby instance. - -[This issue might help](https://github.com/dotansimha/graphql-code-generator/issues/5024) - - +It also sets up everything needed for [GraphQL Config](https://www.graphql-config.com/). ## Community Plugins -There are also community Gatsby plugins that integrate with `@graphql-codegen`: +Gatsby's GraphQL Typegen feature is solving most common use cases. If you find yourself limited by its features you should open a feature request or trying using one of these community plugins: -- [gatsby-plugin-graphql-codegen](https://github.com/d4rekanguok/gatsby-typescript/tree/master/packages/gatsby-plugin-graphql-codegen) - [gatsby-plugin-typegen](https://github.com/cometkim/gatsby-plugin-typegen)