No QueryClient set, use QueryClientProvider to set one #9809
Unanswered
stevenmckinnon
asked this question in
Q&A
Replies: 0 comments
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Uh oh!
There was an error while loading. Please reload this page.
-
Describe the bug
Hi,
Apologies in advanced, this is something I'm building at my job so it will be slightly vague but I will do my best to describe it.
I have a library, let's call "Core". Core is an app wrapper that sets up a bunch of basic things for applications, theme provider etc. This includes
QueryClientProviderfrom this library, and exposes some queries for consumers to use.@tanstack/react-queryis installed as a peer dependency here.I have another library that is a reporting tool, it uses these queries in it's components and that all works fine when I'm testing in Storybook.
@tanstack/react-queryis not installed as a dependency here but Core is pulling it in when installed.When I try to install both of these libraries into my application, and wrap the whole app with Core, I get the error
No QueryClient set, use QueryClientProvider to set oneTechnical details:
Using Vite as build tool with
vite-plugin-externalize-depsto externalize peer dependenciesCore library structure: App → Core (provides QueryClientProvider) → ReportingLibrary (uses useQuery hooks)
The QueryClientProvider is definitely rendered (confirmed with React DevTools)
Error occurs when ReportingLibrary components try to use the hooks
Works in isolation (Storybook) but fails when all libraries are composed together
Using
@tanstack/react-queryversion5.90.3Suspected issue: Multiple instances of
@tanstack/react-querybeing loaded despite peer dependency configuration, causing context isolation between the provider and consumers across package boundaries.What I've tried:
Confirmed
@tanstack/react-queryis a peer dependency in CoreAdded explicit externalization in Vite config
Verified no duplicate installations with npm ls
Exported QueryClient instance from Core library
Has anyone encountered similar issues with library composition and React Query context not crossing package boundaries?
I am using Vite as a build tool.
Your minimal, reproducible example
Not possible
Steps to reproduce
Add and export
QueryClientProviderand queries to library ABuild and publish library A
Install to library B and consume queries
Build and publish library B
Install both library A and B to application
Wrap application in
QueryClientProviderfrom library AExpected behavior
Queries should find the
QueryClientProviderwrapping the applicationHow often does this bug happen?
Every time
Screenshots or Videos
No response
Platform
Windows
Tanstack Query adapter
None
TanStack Query version
5.90.3
TypeScript version
5.2.2
Additional context
No response
Beta Was this translation helpful? Give feedback.
All reactions