TanStack/query · error

No QueryClient was found in Svelte context. Did you forget t

Error message

No QueryClient was found in Svelte context. Did you forget to wrap your component with QueryClientProvider?

What it means

Thrown by `getQueryClientContext` in `@tanstack/svelte-query`. The function calls Svelte's `getContext` with the internal `QueryClient` symbol key; if no ancestor called `setQueryClientContext` (typically via `QueryClientProvider`), the context is undefined and the function refuses to return.

Source

Thrown at packages/svelte-query/src/context.ts:11

import { getContext, setContext } from 'svelte'
import type { QueryClient } from '@tanstack/query-core'
import type { Box } from './containers.svelte'

const _contextKey = Symbol('QueryClient')

/** Retrieves a Client from Svelte's context */
export const getQueryClientContext = (): QueryClient => {
  const client = getContext<QueryClient | undefined>(_contextKey)
  if (!client) {
    throw new Error(
      'No QueryClient was found in Svelte context. Did you forget to wrap your component with QueryClientProvider?',
    )
  }

  return client
}

/** Sets a QueryClient on Svelte's context */
export const setQueryClientContext = (client: QueryClient): void => {
  setContext(_contextKey, client)
}

const _isRestoringContextKey = Symbol('isRestoring')

/** Retrieves a `isRestoring` from Svelte's context */
export const getIsRestoringContext = (): Box<boolean> => {
  try {
    const isRestoring = getContext<Box<boolean> | undefined>(

View on GitHub (pinned to 159982c80b)

Solutions

1. Wrap the component tree with `<QueryClientProvider client={queryClient}>`.
2. Call `setQueryClientContext(queryClient)` in the root component's setup if not using the provider component.
3. Ensure hooks are called inside `.svelte` components or `.svelte.js/.svelte.ts` modules invoked from a component's reactive context.
4. For SSR, set the client in the root `+layout.svelte` and verify context propagation through slots.

Example fix

// before
// App.svelte
<Counter />
// after
<script>import { QueryClient, QueryClientProvider } from '@tanstack/svelte-query'; const qc = new QueryClient();</script>
<QueryClientProvider client={qc}><Counter /></QueryClientProvider>

import { getContext } from 'svelte'
import { QueryClient } from '@tanstack/query-core'
const QUERY_CLIENT_KEY = Symbol('QueryClient')
function peekQueryClient(): QueryClient | undefined {
  return getContext<QueryClient | undefined>(QUERY_CLIENT_KEY)
}

const isQueryClient = (v: unknown): v is QueryClient =>
  !!v && typeof (v as QueryClient).getQueryCache === 'function'

When it happens

Trigger: Using any svelte-query hook (`createQuery`, `createMutation`, etc.) in a component rendered outside `<QueryClientProvider>`; calling a hook in a `.svelte.ts` module that runs outside the component tree; setting the client on a different context key; SSR where context was not propagated.

Common situations: Forgetting the provider in `App.svelte` or `+layout.svelte`; using svelte-query inside a non-component utility; providing the client only in a child route while hooks run in the parent; mixing `setQueryClientContext` with a custom key.

Related errors

• No QueryClient set, use QueryClientProvider to set one
• No QueryClient found
• No QueryClient found
• No 'queryClient' found in Vue context, use 'VueQueryPlugin'
• Expected enabled to be a boolean or a callback that returns

AI-assisted analysis of TanStack/query@159982c80b (2026-08-12). Data as JSON: /api/errors/ad30063cf3d132e6. Report an issue: GitHub.