Next.js Discord

Discord Forum

First thing i got after installation and starting dev server was error!!

Unanswered
Williamson's Sapsucker posted this in #help-forum
Open in Discord
Williamson's SapsuckerOP
Hello 👋
i created the next-app using bun.
no errors while installing
edited nothing
started dev server by bun dev
server starts with no errors
when i open localhost:3000
i get this error
Hydration failed because the server rendered HTML didn't match the client. As a result this tree will be regenerated on the client. This can happen if a SSR-ed Client Component used:

i dont know much about ssr. and i dont want to use it.
i thought the error was happening because of the import Image from "next/image";
so i removed everything from the page and put simple hello world message.
error goes away but tailwind isnt working
how do i fix this?

22 Replies

this is dark reader browser extension
You've 2 options:
1. Add a suppressHydrationWarning prop in your html tag
2. Disable dark reader for localhost, recommended
Williamson's SapsuckerOP
ohh 😭
it is trying to inject props in your html tag which causes the markup mismatch and hence this error
Williamson's SapsuckerOP
i removed extension
there is no error
but tailwind is not working
@Yi Lon Ma it is trying to inject props in your `html` tag which causes the markup mismatch and hence this error
Williamson's SapsuckerOP
do i have to install tailwind Separately? it asked if i wanted to use tailwind. i thought it was installed and configured on it own while installing
@Yi Lon Ma yes it configures it for you
Williamson's SapsuckerOP
why is it not working then 😭
send screenshot
Williamson's SapsuckerOP
@Yi Lon Ma send screenshot
Williamson's SapsuckerOP
here
show your layout file
@Yi Lon Ma show your layout file
Williamson's SapsuckerOP
hmm this is weird
stop the dev server, remove .next folder and try again
Williamson's SapsuckerOP
ok
if it doesn't work, look for tailwind related posts in #help-forum or on google
@Yi Lon Ma if it doesn't work, look for tailwind related posts in <#1007476603422527558> or on google
Williamson's SapsuckerOP
it didnt work 😭 .