From 9464661ed6ebbed389b9c398b912e4fc8aaf1b69 Mon Sep 17 00:00:00 2001
From: Eddy Nguyen <ch@eddeee888.me>
Date: Thu, 2 Jul 2026 20:31:34 +1000
Subject: [PATCH 1/2] Remove typescript plugin from docs for client use case
 (#10887)

---
 .../docs/advanced/generated-files-colocation.mdx |  2 +-
 .../src/pages/docs/advanced/how-does-it-work.mdx |  2 +-
 .../docs/config-reference/documents-field.mdx    |  4 ++--
 .../pages/docs/config-reference/schema-field.mdx |  2 +-
 .../getting-started/development-workflow.mdx     |  2 +-
 website/src/pages/docs/guides/angular.mdx        |  2 +-
 website/src/pages/docs/guides/svelte.mdx         |  2 +-
 .../pages/docs/integrations/create-react-app.mdx |  2 +-
 .../typescript/named-operations-object.mdx       |  2 +-
 .../typescript/relay-operation-optimizer.mdx     |  2 +-
 .../plugins/typescript/typed-document-node.mdx   |  2 +-
 .../typescript/typescript-apollo-angular.mdx     |  2 +-
 .../typescript/typescript-apollo-next.mdx        | 16 ++++++++--------
 .../typescript/typescript-react-apollo.mdx       |  6 +++---
 .../typescript/typescript-react-query.mdx        | 10 +++++-----
 .../typescript/typescript-svelte-apollo.mdx      |  8 ++++----
 16 files changed, 33 insertions(+), 33 deletions(-)

diff --git a/website/src/pages/docs/advanced/generated-files-colocation.mdx b/website/src/pages/docs/advanced/generated-files-colocation.mdx
index fbe6053bf52..4010e7cb3d1 100644
--- a/website/src/pages/docs/advanced/generated-files-colocation.mdx
+++ b/website/src/pages/docs/advanced/generated-files-colocation.mdx
@@ -25,7 +25,7 @@ const config: CodegenConfig = {
   documents: './src/**/*.tsx',
   generates: {
     'graphql/generated.ts': {
-      plugins: ['typescript', 'typescript-operations', 'typescript-urql'],
+      plugins: ['typescript-operations', 'typescript-urql'],
       config: { withHooks: true },
     },
   },
diff --git a/website/src/pages/docs/advanced/how-does-it-work.mdx b/website/src/pages/docs/advanced/how-does-it-work.mdx
index c723b219b39..bf89da8927c 100644
--- a/website/src/pages/docs/advanced/how-does-it-work.mdx
+++ b/website/src/pages/docs/advanced/how-does-it-work.mdx
@@ -97,7 +97,7 @@ import { CodegenConfig } from '@graphql-codegen/cli';
 const config: CodegenConfig = {
   schema: 'http://localhost:3333',
   generates: {
-    'types-and-hooks.tsx': { plugins: ['typescript', 'typescript-operations', 'typescript-react-query'] },
+    'types-and-hooks.tsx': { plugins: ['typescript-operations', 'typescript-react-query'] },
   },
 };
 export default config;
diff --git a/website/src/pages/docs/config-reference/documents-field.mdx b/website/src/pages/docs/config-reference/documents-field.mdx
index 3d2b4920d76..d6485228142 100644
--- a/website/src/pages/docs/config-reference/documents-field.mdx
+++ b/website/src/pages/docs/config-reference/documents-field.mdx
@@ -27,7 +27,7 @@ const config: CodegenConfig = {
   schema: 'http://localhost:3000/graphql',
   documents: 'src/**/*.graphql',
   generates: {
-    './src/types.ts': { plugins: ['typescript', 'typescript-operations'] }
+    './src/types.ts': { plugins: ['typescript-operations'] }
   }
 }
 export default config
@@ -45,7 +45,7 @@ const config: CodegenConfig = {
   generates: {
     './src/types1.ts': {
       documents: 'src/**/*.graphql',
-      plugins: ['typescript', 'typescript-operations']
+      plugins: ['typescript-operations']
     }
   }
 }
diff --git a/website/src/pages/docs/config-reference/schema-field.mdx b/website/src/pages/docs/config-reference/schema-field.mdx
index eb9d8c2f28f..9bb4ff82be3 100644
--- a/website/src/pages/docs/config-reference/schema-field.mdx
+++ b/website/src/pages/docs/config-reference/schema-field.mdx
@@ -66,7 +66,7 @@ const config: CodegenConfig = {
   generates: {
     './src/types.ts': {
       schema: './schema.graphql',
-      plugins: ['typescript', 'typescript-operations']
+      plugins: ['typescript-operations']
     }
   }
 };
diff --git a/website/src/pages/docs/getting-started/development-workflow.mdx b/website/src/pages/docs/getting-started/development-workflow.mdx
index 9ff1c1ea316..f1d5d6f173c 100644
--- a/website/src/pages/docs/getting-started/development-workflow.mdx
+++ b/website/src/pages/docs/getting-started/development-workflow.mdx
@@ -101,7 +101,7 @@ const config: CodegenConfig = {
   schema: 'server/src/**/*.graphql',
   documents: 'client/src/**/*.graphql',
   generates: {
-    'client/src/models.ts': ['typescript', 'typescript-operations'],
+    'client/src/models.ts': ['typescript-operations'],
     'server/src/models.ts': ['typescript', 'typescript-resolver']
   }
 }
diff --git a/website/src/pages/docs/guides/angular.mdx b/website/src/pages/docs/guides/angular.mdx
index d1d2cf319b9..bccf98aded2 100644
--- a/website/src/pages/docs/guides/angular.mdx
+++ b/website/src/pages/docs/guides/angular.mdx
@@ -118,7 +118,7 @@ const config: CodegenConfig = {
   documents: './src/**/*.ts',
   generates: {
     './graphql/generated.ts': {
-      plugins: ['typescript', 'typescript-operations', 'typescript-apollo-angular']
+      plugins: ['typescript-operations', 'typescript-apollo-angular']
     }
   }
 }
diff --git a/website/src/pages/docs/guides/svelte.mdx b/website/src/pages/docs/guides/svelte.mdx
index 94b1b39b661..dc0d52c0954 100644
--- a/website/src/pages/docs/guides/svelte.mdx
+++ b/website/src/pages/docs/guides/svelte.mdx
@@ -93,7 +93,7 @@ const config: CodegenConfig = {
   documents: './src/**/*.gql',
   generates: {
     './graphql/generated.ts': {
-      plugins: ['typescript', 'typescript-operations', 'graphql-codegen-svelte-apollo']
+      plugins: ['typescript-operations', 'graphql-codegen-svelte-apollo']
     }
   }
 }
diff --git a/website/src/pages/docs/integrations/create-react-app.mdx b/website/src/pages/docs/integrations/create-react-app.mdx
index 3c1525627c0..ac9760767de 100644
--- a/website/src/pages/docs/integrations/create-react-app.mdx
+++ b/website/src/pages/docs/integrations/create-react-app.mdx
@@ -15,7 +15,7 @@ const config: CodegenConfig = {
   documents: 'src/**/*.graphql',
   generates: {
     'components.tsx': {
-      plugins: ['typescript', 'typescript-operations', 'typescript-react-apollo']
+      plugins: ['typescript-operations', 'typescript-react-apollo']
     }
   }
 }
diff --git a/website/src/pages/plugins/typescript/named-operations-object.mdx b/website/src/pages/plugins/typescript/named-operations-object.mdx
index 28a23d50d10..9843508344d 100644
--- a/website/src/pages/plugins/typescript/named-operations-object.mdx
+++ b/website/src/pages/plugins/typescript/named-operations-object.mdx
@@ -44,7 +44,7 @@ const config: CodegenConfig = {
   documents: 'YOUR_OPERATIONS',
   generates: {
     './types.ts': {
-      plugins: ['typescript', 'typescript-operations', 'named-operations-object']
+      plugins: ['typescript-operations', 'named-operations-object']
     }
   }
 }
diff --git a/website/src/pages/plugins/typescript/relay-operation-optimizer.mdx b/website/src/pages/plugins/typescript/relay-operation-optimizer.mdx
index 9b5ae5bbeb1..8fba7c034e6 100644
--- a/website/src/pages/plugins/typescript/relay-operation-optimizer.mdx
+++ b/website/src/pages/plugins/typescript/relay-operation-optimizer.mdx
@@ -50,7 +50,7 @@ const config: CodegenConfig = {
         skipDocumentsValidation: true,
         flattenGeneratedTypes: true
       },
-      plugins: ['typescript', 'typescript-operations', 'typescript-react-apollo']
+      plugins: ['typescript-operations', 'typescript-react-apollo']
     }
   }
 }
diff --git a/website/src/pages/plugins/typescript/typed-document-node.mdx b/website/src/pages/plugins/typescript/typed-document-node.mdx
index 08196a45524..9c835967a7d 100644
--- a/website/src/pages/plugins/typescript/typed-document-node.mdx
+++ b/website/src/pages/plugins/typescript/typed-document-node.mdx
@@ -50,7 +50,7 @@ const config: CodegenConfig = {
   documents: './src/**/*.graphql',
   generates: {
     './src/graphql-operations.ts': {
-      plugins: ['typescript', 'typescript-operations', 'typed-document-node']
+      plugins: ['typescript-operations', 'typed-document-node']
     }
   }
 }
diff --git a/website/src/pages/plugins/typescript/typescript-apollo-angular.mdx b/website/src/pages/plugins/typescript/typescript-apollo-angular.mdx
index e59a8ca42d9..40e5fec2a0b 100644
--- a/website/src/pages/plugins/typescript/typescript-apollo-angular.mdx
+++ b/website/src/pages/plugins/typescript/typescript-apollo-angular.mdx
@@ -39,7 +39,7 @@ const config: CodegenConfig = {
   // ...
   generates: {
     'path/to/output.ts': {
-      plugins: ['typescript', 'typescript-operations', 'typescript-apollo-angular']
+      plugins: ['typescript-operations', 'typescript-apollo-angular']
     }
   }
 }
diff --git a/website/src/pages/plugins/typescript/typescript-apollo-next.mdx b/website/src/pages/plugins/typescript/typescript-apollo-next.mdx
index 2e25bd6b6bf..a1165a22bdd 100644
--- a/website/src/pages/plugins/typescript/typescript-apollo-next.mdx
+++ b/website/src/pages/plugins/typescript/typescript-apollo-next.mdx
@@ -74,7 +74,7 @@ const config: CodegenConfig = {
   // ...
   generates: {
     'path/to/file.ts': {
-      plugins: ['typescript', 'typescript-operations', 'typescript-react-apollo'],
+      plugins: ['typescript-operations', 'typescript-react-apollo'],
       config: {
         reactApolloVersion: 3
       }
@@ -99,7 +99,7 @@ const config: CodegenConfig = {
   // ...
   generates: {
     'path/to/file.ts': {
-      plugins: ['typescript', 'typescript-operations', 'typescript-react-apollo'],
+      plugins: ['typescript-operations', 'typescript-react-apollo'],
       config: {
         withHOC: 'I'
       }
@@ -124,7 +124,7 @@ const config: CodegenConfig = {
   // ...
   generates: {
     'path/to/file.ts': {
-      plugins: ['typescript', 'typescript-operations', 'typescript-react-apollo'],
+      plugins: ['typescript-operations', 'typescript-react-apollo'],
       config: {
         withHooks: 'I'
       }
@@ -182,7 +182,7 @@ const config: CodegenConfig = {
   // ...
   generates: {
     'path/to/file.ts': {
-      plugins: ['typescript', 'typescript-operations', 'typescript-react-apollo'],
+      plugins: ['typescript-operations', 'typescript-react-apollo'],
       config: {
         gqlImport: 'graphql.macro#gql'
       }
@@ -201,7 +201,7 @@ const config: CodegenConfig = {
   // ...
   generates: {
     'path/to/file.ts': {
-      plugins: ['typescript', 'typescript-operations', 'typescript-react-apollo'],
+      plugins: ['typescript-operations', 'typescript-react-apollo'],
       config: {
         gqlImport: 'gatsby#graphql'
       }
@@ -473,7 +473,7 @@ const config: CodegenConfig = {
   // ...
   generates: {
     'path/to/file.ts': {
-      plugins: ['typescript', 'typescript-operations', 'typescript-react-apollo'],
+      plugins: ['typescript-operations', 'typescript-react-apollo'],
       config: {
         typesPrefix: 'I'
       }
@@ -498,7 +498,7 @@ const config: CodegenConfig = {
   // ...
   generates: {
     'path/to/file.ts': {
-      plugins: ['typescript', 'typescript-operations', 'typescript-react-apollo'],
+      plugins: ['typescript-operations', 'typescript-react-apollo'],
       config: {
         skipTypename: true
       }
@@ -524,7 +524,7 @@ const config: CodegenConfig = {
   // ...
   generates: {
     'path/to/file.ts': {
-      plugins: ['typescript', 'typescript-operations', 'typescript-react-apollo'],
+      plugins: ['typescript-operations', 'typescript-react-apollo'],
       config: {
         nonOptionalTypename: true
       }
diff --git a/website/src/pages/plugins/typescript/typescript-react-apollo.mdx b/website/src/pages/plugins/typescript/typescript-react-apollo.mdx
index b8aa072ce24..8ab1e3697e1 100644
--- a/website/src/pages/plugins/typescript/typescript-react-apollo.mdx
+++ b/website/src/pages/plugins/typescript/typescript-react-apollo.mdx
@@ -66,7 +66,7 @@ const config: CodegenConfig = {
   documents: './src/**/*.graphql',
   generates: {
     './generated-types.ts': {
-      plugins: ['typescript', 'typescript-operations', 'typescript-react-apollo']
+      plugins: ['typescript-operations', 'typescript-react-apollo']
     }
   }
 }
@@ -102,7 +102,7 @@ const config: CodegenConfig = {
   documents: './src/**/*.graphql',
   generates: {
     './generated-types.ts': {
-      plugins: ['typescript', 'typescript-operations', 'typescript-react-apollo'],
+      plugins: ['typescript-operations', 'typescript-react-apollo'],
       config: {
         withComponent: true
       }
@@ -125,7 +125,7 @@ const config: CodegenConfig = {
   documents: './src/**/*.graphql',
   generates: {
     './generated-types.ts': {
-      plugins: ['typescript', 'typescript-operations', 'typescript-react-apollo'],
+      plugins: ['typescript-operations', 'typescript-react-apollo'],
       config: {
         withHOC: true
       }
diff --git a/website/src/pages/plugins/typescript/typescript-react-query.mdx b/website/src/pages/plugins/typescript/typescript-react-query.mdx
index 75daf8f1f20..cc1c6a26e9a 100644
--- a/website/src/pages/plugins/typescript/typescript-react-query.mdx
+++ b/website/src/pages/plugins/typescript/typescript-react-query.mdx
@@ -45,7 +45,7 @@ const config: CodegenConfig = {
   documents: './src/**/*.graphql',
   generates: {
     './generates.ts': {
-      plugins: ['typescript', 'typescript-operations', 'typescript-react-query'],
+      plugins: ['typescript-operations', 'typescript-react-query'],
       config: {
         fetcher: 'fetch'
       }
@@ -85,7 +85,7 @@ const config: CodegenConfig = {
   documents: './src/**/*.graphql',
   generates: {
     './generates.ts': {
-      plugins: ['typescript', 'typescript-operations', 'typescript-react-query'],
+      plugins: ['typescript-operations', 'typescript-react-query'],
       config: {
         fetcher: {
           endpoint: 'http://localhost:3000/graphql',
@@ -113,7 +113,7 @@ const config: CodegenConfig = {
   documents: './src/**/*.graphql',
   generates: {
     './generates.ts': {
-      plugins: ['typescript', 'typescript-operations', 'typescript-react-query'],
+      plugins: ['typescript-operations', 'typescript-react-query'],
       config: {
         fetcher: {
           endpoint: 'process.env.ENDPOINT'
@@ -181,7 +181,7 @@ const config: CodegenConfig = {
   documents: './src/**/*.graphql',
   generates: {
     './generates.ts': {
-      plugins: ['typescript', 'typescript-operations', 'typescript-react-query'],
+      plugins: ['typescript-operations', 'typescript-react-query'],
       config: {
         fetcher: 'graphql-request'
       }
@@ -215,7 +215,7 @@ const config: CodegenConfig = {
   documents: './src/**/*.graphql',
   generates: {
     './generates.ts': {
-      plugins: ['typescript', 'typescript-operations', 'typescript-react-query'],
+      plugins: ['typescript-operations', 'typescript-react-query'],
       config: {
         fetcher: {
           func: './my-file#myFetcher',
diff --git a/website/src/pages/plugins/typescript/typescript-svelte-apollo.mdx b/website/src/pages/plugins/typescript/typescript-svelte-apollo.mdx
index d976ea01159..820f4ebf1d2 100644
--- a/website/src/pages/plugins/typescript/typescript-svelte-apollo.mdx
+++ b/website/src/pages/plugins/typescript/typescript-svelte-apollo.mdx
@@ -37,7 +37,7 @@ import type { CodegenConfig } from '@graphql-codegen/cli'
 const config: CodegenConfig = {
   generates: {
     'path/to/file.ts': {
-      plugins: ['typescript', 'typescript-operations', 'graphql-codegen-svelte-apollo'],
+      plugins: ['typescript-operations', 'graphql-codegen-svelte-apollo'],
       config: {
         clientPath: 'PATH_TO_APOLLO_CLIENT'
       }
@@ -62,7 +62,7 @@ import type { CodegenConfig } from '@graphql-codegen/cli'
 const config: CodegenConfig = {
   generates: {
     'path/to/file.ts': {
-      plugins: ['typescript', 'typescript-operations', 'graphql-codegen-svelte-apollo'],
+      plugins: ['typescript-operations', 'graphql-codegen-svelte-apollo'],
       config: {
         clientPath: 'PATH_TO_APOLLO_CLIENT',
         asyncQuery: true
@@ -108,7 +108,7 @@ const config: CodegenConfig = {
   documents: './src/**/*.graphql',
   generates: {
     'path/to/file.ts': {
-      plugins: ['typescript', 'typescript-operations', 'graphql-codegen-svelte-apollo'],
+      plugins: ['typescript-operations', 'graphql-codegen-svelte-apollo'],
       config: {
         clientPath: 'PATH_TO_APOLLO_CLIENT'
       }
@@ -177,7 +177,7 @@ const config: CodegenConfig = {
   documents: './src/**/*.graphql',
   generates: {
     'path/to/file.ts': {
-      plugins: ['typescript', 'typescript-operations', 'graphql-codegen-svelte-apollo'],
+      plugins: ['typescript-operations', 'graphql-codegen-svelte-apollo'],
       config: {
         clientPath: 'PATH_TO_APOLLO_CLIENT',
         asyncQuery: true

From b32c176b8b254bfb341036acbc7812f72a48d399 Mon Sep 17 00:00:00 2001
From: Eddy Nguyen <ch@eddeee888.me>
Date: Thu, 2 Jul 2026 22:24:26 +1000
Subject: [PATCH 2/2] Add missing @graphql-typed-document-node/core in doc
 (#10888)

---
 website/src/pages/docs/guides/react-vue.mdx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/website/src/pages/docs/guides/react-vue.mdx b/website/src/pages/docs/guides/react-vue.mdx
index 463e7482ab5..653075c04c8 100644
--- a/website/src/pages/docs/guides/react-vue.mdx
+++ b/website/src/pages/docs/guides/react-vue.mdx
@@ -51,7 +51,7 @@ All the below code examples are available in our
 For most GraphQL clients and frameworks (React, Vue), install the following packages:
 
 ```sh npm2yarn
-npm install graphql
+npm install graphql @graphql-typed-document-node/core
 npm install --save-dev typescript @graphql-codegen/cli @parcel/watcher
 ```