Ajuda com React: tela em branco pra sempre

Att: o problema está na exportação dos svgs na pasta src/styles/Icons.ts, mas ainda não sei o exato motivo

Estou criando um projeto com React/Typescript usando Vite, já tem um tamanho considerável, mas depende a mudança que eu faço, ele fica em loading pra sempre, e não fecha o servidor no terminal. A tela não aparece nenhum erro, nem no console nem no terminal.

Link do projeto: https://github.com/vitormarkis/cloning-twitter

Estou pensando em criar um projeto novo do zero, e ir passando arquivo por arquivo até encontrar o problema.

Versões: Vite v4.0.4 React 18.0.26 React DOM 18.0.9 vitejs/pluginjs 3.0.0 typescript 4.9.3

taodutrahá 2 anos

Poderia compartilhar a estrutura inicial do seu código? (link do github) Seria mais prático para poder te ajudar.

vitormarkishá 2 anos
Eu atualizei o post colocando o link do projeto, foda que eu n tenho ideia do que seja, achei que poderia ser a importação do styled icons que não estava encontrando o elemento que eu estava desestruturando dele, por isso a demora sem aparacer erros de log nem na tela, mas já consertei os caminhos, ja chequei e ta tudo ok.
taodutraano passado
Utilizando o seu repo, todos os testes que fiz carregaram instantaneamente. Mudando estrutura, conteúdo e estilo. Poderia descrever que tipo de mudança que te dá este loading eterno? Versões de execução: node v18.12.1 npm v8.19.2
vitormarkisano passado
taodutra, o problema estava no caminho dos SVGs importados e exportados no src/styles/Icons, onde pra você, os caminhos ele deve ter encontrado os SVGs, mas no meu ele não encontrou, ai tive que usar o caminho relativo, e a partir dai ele voltou a funcionar, acho que tem alguma coisa a ver com dependencia global e local, se vc puder me tirar essa duvida aparentemente ele entrava em loop tentando achar o bendito svg em um caminho e nao encontrava
taodutraano passado
Oi Vitor, Fiz os seguintes testes: - Retirei a estrutura relativa dos paths - Importei novos ícones - Os exportei - Utilizei nas páginas Tudo funcionou perfeitamente. Como estava: ```javascript export { Home } from '../../node_modules/@styled-icons/boxicons-solid/Home'; ``` Como deixei: ```javascript export { Home } from '@styled-icons/boxicons-solid/Home'; ``` Buscando casos similares ao seu, encontrei vários resolvendo esta solução de `Vite ` com `styled-icons` usando isto. https://www.npmjs.com/package/vite-plugin-babel-macros Espero que te ajude.
FelipeLChá 2 anos

Vitor, precisaremos de mais detalhes do seu código. Aguardamos o retorno!

vitormarkishá 2 anos
Eu atualizei o post colocando o link do projeto, foda que eu n tenho ideia do que seja, achei que poderia ser a importação do styled icons que não estava encontrando o elemento que eu estava desestruturando dele, por isso a demora sem aparacer erros de log nem na tela, mas já consertei os caminhos, ja chequei e ta tudo ok.
CarlosZieglerhá 2 anos

talvez o hrm ( hot refresh module ) nao esteja atualizando os modulos ou algo assim, mas normalmente isso ficaria explicito. Sem mais contexto ficaria dificil ajudar.

vitormarkishá 2 anos
Carlos eu atualizei o post colocando o link do projeto, se vc puder dar uma olhada, valeu