AddressForAll / site-v2

New AddressForAll website, version 3 of attempts to make it better
Apache License 2.0
1 stars 0 forks source link

Falha no site #53

Closed crebollobr closed 1 year ago

crebollobr commented 1 year ago

Banch issues/24

Nossa versão de software é node -v v18.15.0 npm -v 9.4.0

Distributor ID: Ubuntu Description: Ubuntu 22.04.2 LTS Release: 22.04 Codename: jammy

Sequencia de comandos git clone -b issues/24 https://github.com/AddressForAll/site-v2.git cd site-v2/ npm install npm run dev

no site /about

image

image

image

ppKrauss commented 1 year ago

@ArrthurGeronimo o seu PullRequest será aprovado somente depois de resolvida essa issue sobre versão do Node.

Ver também https://github.com/AddressForAll/suporte/blob/master/docs/pt/infra.md

ArrthurGeronimo commented 1 year ago

O erro de hidratação é meio que comum no Nextjs, ocorre quando a interface inicial não condiz com a interface criada no servidor. O problema desse erro é que ele pode ser gerado por diversos motivos, mas os mais comuns estão relacionados com tags HTML indevidas.

Olhando o projeto identifiquei onde estão os problemas. Atualmente estão na página home e about. Foi criado um componente chamado Link onde ele possui uma tag de link dentro <a></a>, e nessas páginas esse componente é utilizado passando outra tag <a> como children, ou seja, uma tag <a> dentro de outra tag <a>, ocasionando assim uma inconsistência no HTML e gerando o erro de hidratação no Nextjs.

Exemplo de uma inconsistência do site abaixo: image

A solução é simples, basta substituir a tag filha por outro elemento.

Por sugestão do @ppKrauss , irei substituir as tags inconsistentes por span.

Irei subir um commit com essa correção 👍