urql-graphql · kitten · Mar 24, 2023 · Mar 23, 2023 · Mar 23, 2023 · Mar 23, 2023
diff --git a/.changeset/fluffy-tools-marry.md b/.changeset/fluffy-tools-marry.md
@@ -0,0 +1,6 @@
+---
+'@urql/exchange-graphcache': major
+'@urql/core': major
+---
+
+Remove dependence on `graphql` package and replace it with `@0no-co/graphql.web`, which reduces the default bundlesize impact of `urql` packages to a minimum. All types should remain compatible, even if you use `graphql` elsewhere in your app, and if other dependencies are using `graphql` you may alias it to `graphql-web-lite`.
diff --git a/.changeset/tame-pumas-promise.md b/.changeset/tame-pumas-promise.md
@@ -0,0 +1,5 @@
+---
+'@urql/core': patch
+---
+
+Remove dependence on `import { visit } from 'graphql';` with smaller but functionally equivalent alternative.
diff --git a/exchanges/graphcache/package.json b/exchanges/graphcache/package.json
@@ -62,12 +62,10 @@
     "prepublishOnly": "run-s clean build"
   },
   "dependencies": {
+    "@0no-co/graphql.web": "^0.1.6",
     "@urql/core": ">=3.2.2",
     "wonka": "^6.0.0"
   },
-  "peerDependencies": {
-    "graphql": "^0.11.0 || ^0.12.0 || ^0.13.0 || ^14.0.0 || ^15.0.0 || ^16.0.0"
-  },
   "devDependencies": {
     "@cypress/react": "^7.0.2",
     "@urql/core": "workspace:*",

diff --git a/exchanges/graphcache/src/ast/graphql.ts b/exchanges/graphcache/src/ast/graphql.ts
@@ -0,0 +1,55 @@
+import type * as GraphQL from 'graphql';
+
+type OrNever<T> = 0 extends 1 & T ? never : T;
+
+export type IntrospectionQuery =
+  | {
+      readonly __schema: {
+        queryType: { name: string; kind?: any };
+        mutationType?: { name: string; kind?: any } | null;
+        subscriptionType?: { name: string; kind?: any } | null;
+        types?: readonly IntrospectionType[];
+      };
+    }
+  | OrNever<GraphQL.IntrospectionQuery>;
+
+export type IntrospectionTypeRef =
+  | {
+      readonly kind:
+        | 'SCALAR'
+        | 'OBJECT'
+        | 'INTERFACE'
+        | 'ENUM'
+        | 'UNION'
+        | 'INPUT_OBJECT';
+      readonly name?: string;
+      readonly ofType?: IntrospectionTypeRef;
+    }
+  | OrNever<GraphQL.IntrospectionTypeRef>;
+
+export type IntrospectionInputTypeRef =
+  | {
+      readonly kind: 'SCALAR' | 'ENUM' | 'INPUT_OBJECT';
+      readonly name?: string;
+      readonly ofType?: IntrospectionInputTypeRef;
+    }
+  | OrNever<GraphQL.IntrospectionInputTypeRef>;
+
+export type IntrospectionInputValue =
+  | {
+      readonly name: string;
+      readonly description?: string | null;
+      readonly defaultValue?: string | null;
+      readonly type: IntrospectionInputTypeRef;
+    }
+  | OrNever<GraphQL.IntrospectionInputValue>;
+
+export type IntrospectionType =
+  | {
+      readonly kind: string;
+      readonly name: string;
+      readonly fields?: readonly any[];
+      readonly interfaces?: readonly any[];
+      readonly possibleTypes?: readonly any[];
+    }
+  | OrNever<GraphQL.IntrospectionType>;
diff --git a/exchanges/graphcache/src/ast/node.ts b/exchanges/graphcache/src/ast/node.ts
@@ -7,7 +7,7 @@ import {
   FieldNode,
   FragmentDefinitionNode,
   Kind,
-} from 'graphql';
+} from '@0no-co/graphql.web';
 
 export type SelectionSet = ReadonlyArray<SelectionNode>;
 

diff --git a/exchanges/graphcache/src/ast/schema.ts b/exchanges/graphcache/src/ast/schema.ts
@@ -1,10 +1,9 @@
-import {
+import type {
   IntrospectionQuery,
-  IntrospectionSchema,
-  IntrospectionInputValue,
   IntrospectionTypeRef,
+  IntrospectionInputValue,
   IntrospectionType,
-} from 'graphql';
+} from './graphql';
 
 export interface SchemaField {
   name: string;
@@ -37,7 +36,7 @@ export interface PartialIntrospectionSchema {
   queryType: { name: string; kind?: any };
   mutationType?: { name: string; kind?: any } | null;
   subscriptionType?: { name: string; kind?: any } | null;
-  types?: IntrospectionSchema['types'];
+  types?: readonly any[];
 }
 
 export type IntrospectionData =

diff --git a/exchanges/graphcache/src/ast/schemaPredicates.ts b/exchanges/graphcache/src/ast/schemaPredicates.ts
@@ -1,4 +1,7 @@
-import { InlineFragmentNode, FragmentDefinitionNode } from 'graphql';
+import {
+  InlineFragmentNode,
+  FragmentDefinitionNode,
+} from '@0no-co/graphql.web';
 
 import { warn, invariant } from '../helpers/help';
 import { getTypeCondition } from './node';

diff --git a/exchanges/graphcache/src/ast/traversal.ts b/exchanges/graphcache/src/ast/traversal.ts
@@ -6,7 +6,7 @@ import {
   InlineFragmentNode,
   valueFromASTUntyped,
   Kind,
-} from 'graphql';
+} from '@0no-co/graphql.web';
 
 import { getName } from './node';
 

diff --git a/exchanges/graphcache/src/ast/variables.ts b/exchanges/graphcache/src/ast/variables.ts
@@ -2,7 +2,7 @@ import {
   FieldNode,
   OperationDefinitionNode,
   valueFromASTUntyped,
-} from 'graphql';
+} from '@0no-co/graphql.web';
 
 import { getName } from './node';
 

diff --git a/exchanges/graphcache/src/helpers/help.ts b/exchanges/graphcache/src/helpers/help.ts
@@ -3,7 +3,11 @@
 // Every warning and error comes with a number that uniquely identifies them.
 // You can read more about the messages themselves in `docs/graphcache/errors.md`
 
-import { Kind, ExecutableDefinitionNode, InlineFragmentNode } from 'graphql';
+import {
+  Kind,
+  ExecutableDefinitionNode,
+  InlineFragmentNode,
+} from '@0no-co/graphql.web';
 
 export type ErrorCode =
   | 1

diff --git a/exchanges/graphcache/src/offlineExchange.ts b/exchanges/graphcache/src/offlineExchange.ts
@@ -1,5 +1,5 @@
 import { pipe, merge, makeSubject, filter } from 'wonka';
-import { SelectionNode } from 'graphql';
+import { SelectionNode } from '@0no-co/graphql.web';
 
 import {
   Operation,

diff --git a/exchanges/graphcache/src/operations/query.ts b/exchanges/graphcache/src/operations/query.ts
@@ -1,6 +1,11 @@
-import { FieldNode, DocumentNode, FragmentDefinitionNode } from 'graphql';
 import { CombinedError } from '@urql/core';
 
+import {
+  FieldNode,
+  DocumentNode,
+  FragmentDefinitionNode,
+} from '@0no-co/graphql.web';
+
 import {
   getSelectionSet,
   getName,

diff --git a/exchanges/graphcache/src/operations/shared.ts b/exchanges/graphcache/src/operations/shared.ts
@@ -1,10 +1,10 @@
-import { CombinedError } from '@urql/core';
+import { CombinedError, ErrorLike } from '@urql/core';
+
 import {
-  GraphQLError,
   FieldNode,
   InlineFragmentNode,
   FragmentDefinitionNode,
-} from 'graphql';
+} from '@0no-co/graphql.web';
 
 import {
   isDeferred,
@@ -41,20 +41,20 @@ export interface Context {
   parentFieldKey: string;
   parent: Data;
   fieldName: string;
-  error: GraphQLError | undefined;
+  error: ErrorLike | undefined;
   partial: boolean;
   optimistic: boolean;
   __internal: {
     path: Array<string | number>;
-    errorMap: { [path: string]: GraphQLError } | undefined;
+    errorMap: { [path: string]: ErrorLike } | undefined;
   };
 }
 
 export const contextRef: { current: Context | null } = { current: null };
 export const deferRef: { current: boolean } = { current: false };
 
 // Checks whether the current data field is a cache miss because of a GraphQLError
-export const getFieldError = (ctx: Context): GraphQLError | undefined =>
+export const getFieldError = (ctx: Context): ErrorLike | undefined =>
   ctx.__internal.path.length > 0 && ctx.__internal.errorMap
     ? ctx.__internal.errorMap[ctx.__internal.path.join('.')]
     : undefined;

diff --git a/exchanges/graphcache/src/operations/write.ts b/exchanges/graphcache/src/operations/write.ts
@@ -1,6 +1,11 @@
-import { FieldNode, DocumentNode, FragmentDefinitionNode } from 'graphql';
 import { CombinedError } from '@urql/core';
 
+import {
+  FieldNode,
+  DocumentNode,
+  FragmentDefinitionNode,
+} from '@0no-co/graphql.web';
+
 import {
   getFragments,
   getMainOperation,

diff --git a/exchanges/graphcache/src/store/store.ts b/exchanges/graphcache/src/store/store.ts
@@ -1,4 +1,3 @@
-import { DocumentNode } from 'graphql';
 import { TypedDocumentNode, formatDocument, createRequest } from '@urql/core';
 
 import {
@@ -35,6 +34,7 @@ import {
   expectValidOptimisticMutationsConfig,
 } from '../ast';
 
+type DocumentNode = TypedDocumentNode<any, any>;
 type RootField = 'query' | 'mutation' | 'subscription';
 
 /** Implementation of the {@link Cache} interface as created internally by the {@link cacheExchange}.

diff --git a/exchanges/graphcache/src/types.ts b/exchanges/graphcache/src/types.ts
@@ -1,5 +1,12 @@
-import { AnyVariables, TypedDocumentNode, RequestExtensions } from '@urql/core';
-import { GraphQLError, DocumentNode, FragmentDefinitionNode } from 'graphql';
+import {
+  AnyVariables,
+  DocumentInput,
+  RequestExtensions,
+  TypedDocumentNode,
+  ErrorLike,
+} from '@urql/core';
+
+import { FragmentDefinitionNode } from '@0no-co/graphql.web';
 import { IntrospectionData } from './ast';
 
 /** Nullable GraphQL list types of `T`.
@@ -177,7 +184,7 @@ export interface KeyInfo {
  * GraphQL operation: its query document and variables.
  */
 export interface OperationRequest {
-  query: DocumentNode | TypedDocumentNode<any, any>;
+  query: Exclude<DocumentInput<any, any>, string>;
   variables?: any;
 }
 
@@ -209,7 +216,7 @@ export interface ResolveInfo {
   parentFieldKey: string;
   /** Current field that the resolver has been called on. */
   fieldName: string;
-  /** Map of fragment definitions from the {@link DocumentNode}. */
+  /** Map of fragment definitions from the query document. */
   fragments: Fragments;
   /** Full original {@link Variables} object on the {@link OperationRequest}. */
   variables: Variables;
@@ -220,7 +227,7 @@ export interface ResolveInfo {
    * will be set and provided here. This can be useful to recover from an
    * error on a specific field.
    */
-  error: GraphQLError | undefined;
+  error: ErrorLike | undefined;
   /** Flag used to indicate whether the current GraphQL query is only partially cached.
    *
    * @remarks
@@ -257,7 +264,7 @@ export interface ResolveInfo {
  * cached data, as accepted by {@link cache.readQuery}.
  */
 export interface QueryInput<T = Data, V = Variables> {
-  query: string | DocumentNode | TypedDocumentNode<T, V>;
+  query: DocumentInput<T, V>;
   variables?: V;
 }
 
@@ -443,7 +450,7 @@ export interface Cache {
    * ```
    */
   readFragment<T = Data, V = Variables>(
-    fragment: DocumentNode | TypedDocumentNode<T, V>,
+    fragment: TypedDocumentNode<any, any> | TypedDocumentNode<T, V>,
     entity: string | Data | T,
     variables?: V
   ): T | null;
@@ -473,7 +480,7 @@ export interface Cache {
    * ```
    */
   writeFragment<T = Data, V = Variables>(
-    fragment: DocumentNode | TypedDocumentNode<T, V>,
+    fragment: TypedDocumentNode<any, any> | TypedDocumentNode<T, V>,
     data: T,
     variables?: V
   ): void;

diff --git a/packages/core/package.json b/packages/core/package.json
@@ -52,13 +52,8 @@
     "prepare": "node ../../scripts/prepare/index.js",
     "prepublishOnly": "run-s clean build"
   },
-  "devDependencies": {
-    "graphql": "^16.0.0"
-  },
-  "peerDependencies": {
-    "graphql": "^0.11.0 || ^0.12.0 || ^0.13.0 || ^14.0.0 || ^15.0.0 || ^16.0.0"
-  },
   "dependencies": {
+    "@0no-co/graphql.web": "^0.1.6",
     "wonka": "^6.1.2"
   },
   "publishConfig": {

diff --git a/packages/core/src/client.test.ts b/packages/core/src/client.test.ts
@@ -1,4 +1,4 @@
-import { print } from 'graphql';
+import { print } from '@0no-co/graphql.web';
 import { vi, expect, it, beforeEach, describe, afterEach } from 'vitest';
 
 /** NOTE: Testing in this file is designed to test both the client and its interaction with default Exchanges */

diff --git a/packages/core/src/client.ts b/packages/core/src/client.ts
@@ -22,13 +22,11 @@ import {
   Subscription,
 } from 'wonka';
 
-import { DocumentNode } from 'graphql';
-
 import { composeExchanges } from './exchanges';
 import { fallbackExchange } from './exchanges/fallback';
 
 import {
-  TypedDocumentNode,
+  DocumentInput,
   AnyVariables,
   Exchange,
   ExchangeInput,
@@ -358,7 +356,7 @@ export interface Client {
    * ```
    */
   query<Data = any, Variables extends AnyVariables = AnyVariables>(
-    query: DocumentNode | TypedDocumentNode<Data, Variables> | string,
+    query: DocumentInput<Data, Variables>,
     variables: Variables,
     context?: Partial<OperationContext>
   ): OperationResultSource<OperationResult<Data, Variables>>;
@@ -384,7 +382,7 @@ export interface Client {
    * or asynchronously.
    */
   readQuery<Data = any, Variables extends AnyVariables = AnyVariables>(
-    query: DocumentNode | TypedDocumentNode<Data, Variables> | string,
+    query: DocumentInput<Data, Variables>,
     variables: Variables,
     context?: Partial<OperationContext>
   ): OperationResult<Data, Variables> | null;
@@ -450,7 +448,7 @@ export interface Client {
    * ```
    */
   subscription<Data = any, Variables extends AnyVariables = AnyVariables>(
-    query: DocumentNode | TypedDocumentNode<Data, Variables> | string,
+    query: DocumentInput<Data, Variables>,
     variables: Variables,
     context?: Partial<OperationContext>
   ): OperationResultSource<OperationResult<Data, Variables>>;
@@ -519,7 +517,7 @@ export interface Client {
    * ```
    */
   mutation<Data = any, Variables extends AnyVariables = AnyVariables>(
-    query: DocumentNode | TypedDocumentNode<Data, Variables> | string,
+    query: DocumentInput<Data, Variables>,
     variables: Variables,
     context?: Partial<OperationContext>
   ): OperationResultSource<OperationResult<Data, Variables>>;

diff --git a/packages/core/src/exchanges/ssr.ts b/packages/core/src/exchanges/ssr.ts
@@ -1,4 +1,4 @@
-import { GraphQLError } from 'graphql';
+import type { GraphQLError } from '../utils/graphql';
 import { pipe, filter, merge, map, tap } from 'wonka';
 import { Exchange, OperationResult, Operation } from '../types';
 import { addMetadata, CombinedError } from '../utils';

diff --git a/packages/core/src/gql.test.ts b/packages/core/src/gql.test.ts
@@ -1,4 +1,4 @@
-import { parse, print } from 'graphql';
+import { parse, print } from '@0no-co/graphql.web';
 import { vi, expect, it, beforeEach, SpyInstance } from 'vitest';
 
 import { gql } from './gql';

diff --git a/packages/core/src/gql.ts b/packages/core/src/gql.ts
@@ -1,5 +1,6 @@
 /* eslint-disable prefer-rest-params */
-import { DocumentNode, DefinitionNode, Kind } from 'graphql';
+import { Kind } from '@0no-co/graphql.web';
+import type { DocumentNode, DefinitionNode } from './utils/graphql';
 import { AnyVariables, TypedDocumentNode } from './types';
 import { keyDocument, stringifyDocument } from './utils';