2
respostas

[Bug] estou enfrentando alguns erros

esse é meu repositorio https://github.com/GabrielWanderley/NextProject

esse são meus erros

Unhandled Runtime Error Error: There was an error while hydrating. Because the error happened outside of a Suspense boundary, the entire root will switch to client rendering.

Unhandled Runtime Error Error: Hydration failed because the initial UI does not match what was rendered on the server.

Warning: Expected server HTML to contain a matching in .

See more info here:

https://nextjs.org/docs/messages/react-hydration-error

Component Stack

2 respostas

Oi.

Uma coisa que você pode fazer é dar uma conferida se tá usando o Suspense e Lazy Loading do jeito certo. Isso é essencial pra evitar confusão. E se tiver usando getServerSideProps ou getStaticProps, dá uma conferida pra ver se tá tudo ok, sacou?

Agora, sobre esse erro de HTML, o que acontece é que tem um elemento no teu código que tá diferente entre o servidor e o cliente. Pode ser que algum componente tenha mudado ou até sumido sem querer.

O que te aconselho é revisar bem o código. Dá uma olhada se todos os componentes estão alinhados e, se tiver listando algo, não esquece de colocar uma key única pra cada item. E ó, cuidado com mudanças diretas no DOM, isso pode te dar uma dor de cabeça.

Veja a documentação: https://nextjs.org/docs/app/building-your-application/caching#3-react-hydration-and-reconciliation-on-the-client

peguei o codigo da aula direto do github e coloquei tudo no meu projeto e persistiu alguns erros inclusivo um novo sendo esse Unhandled Runtime Error Error: Hydration failed because the initial UI does not match what was rendered on the server.

Warning: Expected server HTML to contain a matching in .

See more info here:

https://nextjs.org/docs/messages/react-hydration-error
e esse 
Unhandled Runtime Error

Error: There was an error while hydrating. Because the error happened outside of a Suspense boundary, the entire root will switch to client rendering.

Component Stack a O _c1 eval a Call Stack

o meu codigo está aqui https://github.com/GabrielWanderley/NextProject

Quer mergulhar em tecnologia e aprendizagem?

Receba a newsletter que o nosso CEO escreve pessoalmente, com insights do mercado de trabalho, ciência e desenvolvimento de software