Next.js Discord

Discord Forum

@tanstack/react-query causing a useLayoutEffect warning?

Answered
Griffon Nivernais posted this in #help-forum
Open in Discord
Avatar
Griffon NivernaisOP
For simplicity's sake, here is a simplified version of my _app.tsx:
import { QueryClient, QueryClientProvider } from "@tanstack/react-query";

import "@/styles/globals.scss";

const QUERY_CLIENT = new QueryClient();

export default function App({ Component, pageProps }) {
    return (
        <QueryClientProvider client={QUERY_CLIENT}>
            <Component {...pageProps} />
        </QueryClientProvider>
    );
}

The error that's produced is as follows, how can I eliminate this?
https://mystb.in/ClicksSimilarlyGarlic
Answered by awareness481
The only case where this warning is useful, is if you re using useLayoutEffect on your own + ssr and it's causing you issues
View full answer

6 Replies

Avatar
Griffon NivernaisOP
Bump.
Avatar
Griffon NivernaisOP
Bump.
Avatar
Griffon NivernaisOP
Bump.
Avatar
awareness481
Just ignore this warning, it has also been removed in newer versions of react because it was too often confusing.
Avatar
awareness481
The only case where this warning is useful, is if you re using useLayoutEffect on your own + ssr and it's causing you issues
Answer
Avatar
Griffon NivernaisOP
Which I am not so that's nice, I'll bump React + React DOM and see if it causes any issues, if it does I'll just ignore it. Thank you so much! 💞