TanStack/query · error
No QueryClient was found in Svelte context. Did you forget…
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.
Solutions
- Wrap the component tree with `<QueryClientProvider client={queryClient}>`.
- Call `setQueryClientContext(queryClient)` in the root component's setup if not using the provider component.
- Ensure hooks are called inside `.svelte` components or `.svelte.js/.svelte.ts` modules invoked from a component's reactive context.
- 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> Defensive patterns
Strategy: validation
Validate before calling
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)
} Type guard
const isQueryClient = (v: unknown): v is QueryClient => !!v && typeof (v as QueryClient).getQueryCache === 'function'
Prevention
- Always wrap the root component tree with `<QueryClientProvider>`.
- Set context via `setQueryClientContext(qc)` in `+layout.svelte` for SvelteKit.
- Keep all svelte-query hook calls inside `.svelte` or `.svelte.ts` modules run from the component tree.
- For SSR, set the client in the root layout and verify propagation.
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.
Appendix: 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)