# @trpc/react-query

> The tRPC React library

Latest version **11.19.0** (published 2026-09-17) · MIT license · 0 weekly downloads

## Install

```sh
npm install @trpc/react-query
pnpm add @trpc/react-query
yarn add @trpc/react-query
bun add @trpc/react-query
```

## Health

**Score 75/100 (B)** — status: active.

Positive: has types; esm support; no vulnerabilities; has provenance; recently updated; high maintenance score; popular repo.

Warnings: low downloads.

## Facts

| | |
|---|---|
| Version | 11.19.0 |
| Published | 2026-09-17 |
| First published | 2022-10-16 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | bundled |
| Module format | ESM + CommonJS |
| Dependencies | 0 |
| Unpacked size | 514.4 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| Provenance | attested (GitHub Actions) |
| GitHub stars | 40664 |
| Author | KATT |
| Maintainers | katt, juliusmarminge |

## Links

- npm: https://www.npmjs.com/package/@trpc/react-query
- Repository: https://github.com/trpc/trpc
- Homepage: https://trpc.io
- Issues: https://github.com/trpc/trpc/issues
- Funding: https://trpc.io/sponsor
- npm.io page: https://npm.io/package/@trpc/react-query

## Recent versions

- 11.19.0 (latest) — 2026-09-17
- 11.19.1-canary.0.sha-8b649ad87 (canary) — 2026-09-17
- 11.13.0 (next) — 2026-03-15
- 10.45.4 (v10) — 2026-01-02
- 11.5.2-alpha-tmp-6955-again.21 (tmp) — 2025-09-25
- 11.5.2-alpha-6955-again-2025-09-24-08-18-00.13 (6955-again) — 2025-09-24
- 10.46.0-alpha-tmp-0202-nosideeffects-main.26 (tmp-main) — 2024-02-02
- 11.18.1-canary.15 — 2026-09-16
- 11.18.1-canary.30 — 2026-09-12
- 11.18.1-canary.9 — 2026-09-12
- 11.18.1-canary.19 — 2026-09-12
- 11.18.1-canary.34.sha-3a77dc4d6 — 2026-09-12
- 11.18.1-canary.18 — 2026-09-12
- 11.18.1-canary.17 — 2026-09-12
- 11.18.1-canary.13 — 2026-09-12
- … 990 more at https://npm.io/package/@trpc/react-query/versions

## README

<p align="center">
  <a href="https://trpc.io/"><img src="https://assets.trpc.io/icons/svgs/blue-bg-rounded.svg" alt="tRPC" height="75"/></a>
</p>

<h3 align="center">tRPC</h3>

<p align="center">
  <strong>End-to-end typesafe APIs made easy</strong>
</p>

<p align="center">
  <img src="https://assets.trpc.io/www/v10/v10-dark-landscape.gif" alt="Demo" />
</p>

# `@trpc/react-query`

> A tRPC wrapper around react-query.

## Documentation

Full documentation for `@trpc/react-query` can be found [here](https://trpc.io/docs/react-query)

## Installation

```bash
# npm
npm install @trpc/react-query @tanstack/react-query

# Yarn
yarn add @trpc/react-query @tanstack/react-query

# pnpm
pnpm add @trpc/react-query @tanstack/react-query

# Bun
bun add @trpc/react-query @tanstack/react-query
```

## Basic Example

Create a utils file that exports tRPC hooks and providers.

```ts
import { createTRPCReact } from '@trpc/react-query';
import type { AppRouter } from './server';

export const trpc = createTRPCReact<AppRouter>();
```

Use the provider to connect to your API.

```ts
import { QueryClient, QueryClientProvider } from '@tanstack/react-query';
import { trpc } from '~/utils/trpc';
import React, { useState } from 'react';

export function App() {
  const [queryClient] = useState(() => new QueryClient());
  const [trpcClient] = useState(() =>
    trpc.createClient({
      url: 'http://localhost:5000/trpc',
    }),
  );
  return (
    <trpc.Provider client={trpcClient} queryClient={queryClient}>
      <QueryClientProvider client={queryClient}>
        {/* Your app here */}
      </QueryClientProvider>
    </trpc.Provider>
  );
}
```

Now in any component, you can query your API using the proxy exported from the utils file.

```ts
import { trpc } from '~/utils/trpc';

export function Hello() {
  const { data, error, status } = trpc.greeting.useQuery({ name: 'tRPC' });

  if (error) {
    return <p>{error.message}</p>;
  }

  if (status !== 'success') {
    return <p>Loading...</p>;
  }

  return <div>{data && <p>{data.greeting}</p>}</div>;
}
```

---
_Source: https://npm.io/package/@trpc/react-query · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._