ReactJs e CSS - Problemas com a estilização da página
Boa noite pessoal,
Estou trabalhando em um código legado escrito com base em um template que já passaram diversos devs por cima. O código foi escrito em ReactJs e CSS e eu precisei acrescentar algumas páginas ao código.
Tudo está funcionando, exceto a estilização. Ao entrar em uma página, ela encontra a página do CSS mas não aplica todas as regras (ou aplica de forma errônea) pois a página fica desconfigurada. Para corrigir isso, eu preciso atualizar a página e então ela "entende" o CSS e fica da forma que deveria ser.
Já tentei algumas alternativas para, no mínimo, entender onde está o problema, como:
- Apaguei todo o CSS e a página perdeu todo o estilo (para verificar se o estilo estava vindo de outro lugar).
- Renomeei todas as classes com um prefixo único para evitar conflitos com outras partes do código.
- Escrevi todo o CSS inline direto nas tags.
- Utilizei "resets" de CSS.
- Utilizei "!important" em todos os itens do CSS.
- Limpei o cache do navegador e abri em uma página anônima.
E nada disso funcionou, continuo precisando recarregar a página para ele entender o que está acontecendo com a estilização.
Alguém tem ideia do que posso estar passando e consegue me ajudar?
Desde já, muito obrigado!
Tem algum css diretamente no html com tag style? Ou com style direto? Ou em algum componente no início da árvore do jsx (normalmente index.tsx, App.tsx, algo assim)? Vc pode olhar no devtools quais arquivos estão sendo carregados pela página também (abas Network, Source, etc)
Difícil dizer o que pode ser sem saber mais detalhes. Esse projeto foi criado como? Create-react-app? O css é importado como?