Coexisting next.js pages & app router leads to: Error: No QueryClient set, use QueryClientProvider to set one

[DorianWilhelm]

Hi!

I'm trying to find a path for incrementally migrating our Next.js 13 app from pages to the app router.
However I'm unable to have the app and pages router coexisting because of errors that originate from wagmi & react-query.

You can find a minimal reproduction repo here: https://github.com/DorianWilhelm/demo-coexist-pages-and-app-router-wagmi

It includes commits that demonstrate:

• a working setup without wagmi
• a broken setup with wagmi
• a hacky fix to make it work

The build breaks when trying to prerender the pages that use wagmi hooks because they do not have access to a queryClient.

I've managed to make the build work by calling getServerSideProps inside the route in the pages router to skip prerendering on the server.

Would love some insights on why this is happening and if there is a better solution.
Thanks y'all!
❤️