How can I use react query outside of react or other framework

[theaungmyatmoe]

I wanna integrate react query in my micro frontend application, but this one is so stick with specific framework. I googled a lot to make sure react query is working with other framework without adapters.

What I want to do is that I wanna use react query as state management over redux and fetching.

But I want to use it in multiple framework without worrying adapters. Because when I sticks state with react provider how can I retrieve from from Vue? It is really complicated for me.

So, can I use react query as a framework agnostic query? Something like vallina query?

If you know how to do it, please let me know.

[TkDodo]

You can use the @tanstack/query-core package, which is in vanilla TypeScript and which is used by all adapters.

Because when I sticks state with react provider how can I retrieve from from Vue? It is really complicated for me.

You can create one QueryClient and pass that to different Providers (vue, react). Then, they will use the same cache and share the data, so you can have something that was added to the cache with react and retrieve it with vue.

But honestly, I thought the goal of microfrontends is to isolate and separate. If two microfrontends write to the same cache and kinda depend on each other - that doesn't sound like a good idea to me ...

[TkDodo]

queryClient
    .getMutationCache()
    .build(queryClient, options)
    .execute(variables)

[nemonemi]

I have noticed that one does not have to load the QueryClient from the @tanstack/query-core for this to work.

[czescwojtek]

Hey is there any documentation regarding query-core usage?

[sgcullen]

Are you able to point to any information/docs on @tanstack/query-core ?
Thanks so much!

[czescwojtek]

@sgcullen I don't think there are any. Jump into the source code to see how it's done