Estou conseguindo acessar o localhost 3000 e esta carregando a pagina, porem esta sem estilo algum, totalmente cru.
Estou conseguindo acessar o localhost 3000 e esta carregando a pagina, porem esta sem estilo algum, totalmente cru.
Olá Leonardo, tudo bem?
Isso geralmente acontece quando os arquivos de estilo (CSS) não estão sendo encontrados ou carregados corretamente pelo navegador. Portanto, para identificar e solucionar esse problema, peço que verifique se no seu arquivo index.html, o link para o Bootstrap está correto. Deve ser algo assim:
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.2.2/dist/css/bootstrap.min.css" rel="stylesheet"
integrity="sha384-Zenh87qX5JnK2Jl0vWa8Ck2rdkQ2Bzep5IDxbcnCeuOxjzrPF/et3URy9Bv1WTRi" crossorigin="anonymous">
Como também no arquivo documento.html:
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.2.2/dist/css/bootstrap.min.css" rel="stylesheet"
integrity="sha384-Zenh87qX5JnK2Jl0vWa8Ck2rdkQ2Bzep5IDxbcnCeuOxjzrPF/et3URy9Bv1WTRi" crossorigin="anonymous">
Também verifique se a estrutura de pastas está correta e que o servidor está servindo a pasta public corretamente. No seu servidor.js, você deve ter algo assim:
import express from "express";
import url from "url";
import path from "path";
const app = express();
const porta = process.env.porta || 3000;
const caminhoAtual = url.fileURLToPath(import.meta.url);
const diretorioPublico = path.join(caminhoAtual, "../..", "public");
app.use(express.static(diretorioPublico));
app.listen(porta, () => console.log(`Servidor escutando na porta ${porta}`));
Caso o problema persista, você pode abrir o console do desenvolvedor no seu navegador (F12 no Chrome) e veja se há algum erro na aba "Console" e compartilhe o erro aqui.
Espero ter ajudado.
Qualquer dúvida, compartilhe no fórum.
Abraços e bons estudos!