# @data-client/graphql > Quickly define typed GraphQL resources and endpoints Latest version **0.18.2** (published 2026-10-12) · Apache-2.0 license · 0 weekly downloads ## Install ```sh npm install @data-client/graphql pnpm add @data-client/graphql yarn add @data-client/graphql bun add @data-client/graphql ``` ## Health **Score 65/100 (B)** — status: active. Positive: has types; esm support; no vulnerabilities; recently updated; high maintenance score. Warnings: low downloads; pre 1.0. ## Facts | | | |---|---| | Version | 0.18.2 | | Published | 2026-10-12 | | First published | 2023-07-02 | | Weekly downloads | 0 | | License | Apache-2.0 | | TypeScript types | bundled | | Module format | ESM + CommonJS | | Node | ^12.17 \|\| ^13.7 \|\| >=14 | | Dependencies | 2 | | Unpacked size | 147.5 KB | | Known vulnerabilities | 0 | | Install scripts | no | | GitHub stars | 2038 | | Author | Nathaniel Tucker (https://github.com/ntucker) | | Maintainers | ntucker | | Keywords | GraphQL, suspense, query, mutation, fetch, data, cache, subscription, model, typescript, data fetching, data cache, api, normalized cache, subject pattern, graph, swr, endpoint, front-end, mobile, react-native, ios, android, web, networking, react, json | ## Links - npm: https://www.npmjs.com/package/@data-client/graphql - Repository: https://github.com/reactive/data-client - Homepage: https://dataclient.io/docs/graphql - Issues: https://github.com/reactive/data-client/issues - Funding: https://github.com/sponsors/ntucker - npm.io page: https://npm.io/package/@data-client/graphql ## Dependencies (2) - [@babel/runtime](https://npm.io/package/@babel/runtime.md) ^7.20.0 - [@data-client/endpoint](https://npm.io/package/@data-client/endpoint.md) ^0.18.2 ## Alternatives - [@mapbox/jsonlint-lines-primitives](https://npm.io/package/@mapbox/jsonlint-lines-primitives.md) — 5.3M weekly downloads - [reftools](https://npm.io/package/reftools.md) — 3.5M weekly downloads - [@hey-api/openapi-ts](https://npm.io/package/@hey-api/openapi-ts.md) — 3.5M weekly downloads - [@mapbox/geojson-rewind](https://npm.io/package/@mapbox/geojson-rewind.md) — 2.4M weekly downloads - [turbo-stream](https://npm.io/package/turbo-stream.md) — 1.7M weekly downloads ## Recent versions - 0.18.2 (latest) — 2026-10-12 - 0.15.1-beta-20251110013913-ef632c49a03da67187b6097fe8154893cd930d30 (beta) — 2025-11-10 - 0.18.0 — 2026-05-01 - 0.16.3 — 2026-04-03 - 0.16.0 — 2026-03-31 - 0.15.7 — 2026-02-18 - 0.15.5 — 2026-01-20 - 0.15.4 — 2026-01-19 - 0.15.2 — 2026-01-05 - 0.15.0-beta-20251022142546-a457d1596871fb28f1a91f2531cc259db4d55a9c — 2025-10-22 - 0.15.0 — 2025-10-22 - 0.15.0-beta-20251022010821-0e5f6bd2963b6deecb68b5febe71cdd3b10c801a — 2025-10-22 - 0.15.0-beta-20251006024044-92bd01c4976f2921993b8c9f1e4dbb87af87ba7b — 2025-10-06 - 0.14.25 — 2025-03-12 - 0.14.21 — 2025-02-27 - … 34 more at https://npm.io/package/@data-client/graphql/versions ## README # Data Client for GraphQL [![CircleCI](https://circleci.com/gh/reactive/data-client/tree/master.svg?style=shield)](https://circleci.com/gh/reactive/data-client) [![Coverage Status](https://img.shields.io/codecov/c/gh/reactive/data-client/master.svg?style=flat-square)](https://app.codecov.io/gh/reactive/data-client?branch=master) [![npm downloads](https://img.shields.io/npm/dm/@data-client/graphql.svg?style=flat-square)](https://www.npmjs.com/package/@data-client/graphql) [![bundle size](https://img.shields.io/bundlephobia/minzip/@data-client/graphql?style=flat-square)](https://bundlephobia.com/result?p=@data-client/graphql) [![npm version](https://img.shields.io/npm/v/@data-client/graphql.svg?style=flat-square)](https://www.npmjs.com/package/@data-client/graphql) [![PRs Welcome](https://img.shields.io/badge/PRs-welcome-brightgreen.svg?style=flat-square)](http://makeapullrequest.com) [![Chat](https://img.shields.io/discord/768254430381735967.svg?style=flat-square&colorB=758ED3)](https://discord.gg/35nb8Mz) [GraphQL Endpoints](https://dataclient.io/graphql) for [Data Client](https://dataclient.io)
**[📖Read The Docs](https://dataclient.io/graphql)**  |  [🎮Github Demo](https://stackblitz.com/github/reactive/data-client/tree/master/examples/github-app?file=src%2Fresources%2FRepository.tsx)
### Define GraphQL endpoint ```typescript const gql = new GQLEndpoint('https://nosy-baritone.glitch.me'); ``` ### Simple TypeScript definition ```typescript class User extends GQLEntity { name = ''; email = ''; } ``` ### Write type-safe queries ```typescript const userList = gql.query( `{ users { id name email } }`, { users: [User] }, ); const userDetail = gql.query( `query UserDetail($name: String!) { user(name: $name) { id name email } }`, { user: User }, ); ``` ### One line data-hookup ```tsx const { user } = useSuspense(userDetail, { name: 'Fong' }); return ( <>

{user.name}

{user.email}

); ``` ### Mutations ```ts const gql = new GQLEndpoint('https://graphql.org/swapi-graphql'); const createReview = gql.mutation( `mutation CreateReviewForEpisode($ep: Episode!, $review: ReviewInput!) { createReview(episode: $ep, review: $review) { stars commentary } }`, { createReview: Review }, ); ``` ```tsx const controller = useController(); const createReview = useFetcher(createReview); return controller.fetch(createReview, data)} />; ``` ## API #### Networking definition - [Endpoints](https://dataclient.io/rest/api/Endpoint): [GQLEndpoint](https://dataclient.io/graphql/api/GQLEndpoint)
Data model
Data Type Mutable Schema Description Queryable
Object ✅ Entity, EntityMixin, GQLEntity single unique object ✅
✅ Union(Entity) polymorphic objects (A | B) ✅
🛑 Object statically known keys 🛑
Invalidate(Entity) delete an entity 🛑
List ✅ Collection(Array) growable lists ✅
🛑 Array immutable lists 🛑
All list of all entities of a kind ✅
Map ✅ Collection(Values) growable maps ✅
🛑 Values immutable maps 🛑
Scalar ✅ Scalar lens-dependent entity fields ✅
any Query(Queryable) memoized custom transforms ✅
Lazy(Schema) deferred denormalization ✅
--- _Source: https://npm.io/package/@data-client/graphql · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._