Encountering an error while using useOptimistic in Next.js 14.
Answered
French Angora posted this in #help-forum
French AngoraOP
I recently updated my application from version 13.5 to 14. Prior to the update, I had been using the experimental_useOptimistic feature without encountering any issues. However, after the upgrade, I began encountering an error message that reads, "experimental_useOptimistic only functions within Client Components. Make sure to include the 'use client' directive at the beginning of the file to enable it." Btw I am indeed using this feature within a client component, and not within a server component, as expected.
Answered by French Angora
For anyone having this problem , the issue is from the @types/react it should be above 18.2.26
30 Replies
Can you show me how you are importing useOptimistic?
import { useOptimistic } from 'react'French AngoraOP
import { experimental_useOptimistic as useOptimistic } from "react"cuz when i import it the way ur doing it they give me this error : Module '"react"' has no exported member 'useOptimistic'
@French Angora js
import { experimental_useOptimistic as useOptimistic } from "react"
cuz when i import it the way ur doing it they give me this error : Module '"react"' has no exported member 'useOptimistic'
Well then thats weird cause that line is directly pulled from the docs
@Clown Well then thats weird cause that line is directly pulled from the docs
Asian black bear
Same thing happening to me rn and I don’t know to fix it
@American Chinchilla is react up to date?
Asian black bear
I have same problem and yes react is up to date
French AngoraOP
m using this version of react
"react": "^18"@French Angora m using this version of react "react": "^18"
American Chinchilla
think that's just the dependency
can you run
npm list in the terminal@American Chinchilla can you run `npm list` in the terminal
French AngoraOP
This
@French Angora This
American Chinchilla
and next is 14 right?
just tested it out and it's working for me with these:
react@18.2.0
react-dom@18.2.0
@types/react@18.2.33
next@14.0.0@American Chinchilla and next is 14 right?
French AngoraOP
yes i just update my next from 13.5 to 14
@American Chinchilla just tested it out and it's working for me with these:
react@18.2.0
react-dom@18.2.0
@types/react@18.2.33
next@14.0.0
French AngoraOP
can you show me the code
American Chinchilla
might be related to @types/react
if you're using TS
French AngoraOP
yeah m using ts
@French Angora can you show me the code
American Chinchilla
i mean i just tried importing it
@French Angora yeah m using ts
American Chinchilla
whats the version of @types/react
@American Chinchilla whats the version of @types/react
French AngoraOP
this
American Chinchilla
that'd do it
try upping it to 18.2.33
French AngoraOP
okay let see
@American Chinchilla that'd do it
French AngoraOP
Thanks brother it worked , appreciate ur time
American Chinchilla
ofc
@Asian black bear we found a fix
French AngoraOP
For anyone having this problem , the issue is from the @types/react it should be above 18.2.26
Answer
American
I have 18.2.26 and still get this error in vscode:
Tried latest version too
"name": "@types/react",
"version": "18.2.26",Tried latest version too