Next.js Discord

Discord Forum

React Query <RQHydrate {...props} >; - errors

Answered
Reddish carpenter ant posted this in #help-forum
Open in Discord
Reddish carpenter antOP
Hi there,

So I've installed react query etc... and I got this error:

'>' expected.ts(1005)
Expression expected.ts(1109)

On this code:
// @ts-nocheck
"use client";

import { Hydrate as RQHydrate, HydrateProps } from "@tanstack/react-query";

function Hydrate(props: HydrateProps) {
  return <RQHydrate {...props} >;
}

export default Hydrate;


And it wont compile:
> next build

 ✓ Creating an optimized production build
 ✓ Compiled successfully
   Linting and checking validity of types  .Failed to compile.

./src/utils/hydrate.client.ts:7:21
Type error: '>' expected.

   5 |
   6 | function Hydrate(props: HydrateProps) {
>  7 |   return <RQHydrate {...props} />;
     |                     ^
   8 | }
   9 |
  10 | export default Hydrate;


I have no idea why or how to fix this
Answered by KINXZ
hydrate.client.ts -> hydrate.client.tsx
View full answer

13 Replies

Reddish carpenter antOP
you have a syntax error
you need to return
return <RQHydrate {...props} />
the closing slash is missing
@KINXZ the closing slash is missing
Reddish carpenter antOP
That doesn't matter, same error with the closing tag
regardles what I do same thiing
ahh
its a .ts file
it needs to be .tsx
hydrate.client.ts -> hydrate.client.tsx
Answer
Reddish carpenter antOP
Ahhh xdd
@KINXZ ahh
Reddish carpenter antOP
Thank you soo much! 😄