Solucionado (ver solução)
Solucionado
(ver solução)
2
respostas

Imagem Background não sobe para a versão do GitHub e Vercel

Quando fiz o versionamento no Vercel e no próprio GitHub. A imagem de background não aparece na versão web. O css está certinho puxando do link e a imagem está na pasta do GitHub. O que pode ser? Tela da Vercel com a imagem do site feito o deploy

2 respostas
solução!

Olá! Tudo bem? Já passei por alguns problemas parecidos antes, onde tudo funcionava em desenvolvimento e quando passava para a produção alguns imports de imagens paravam de funcionar. Uma das soluções que funcionou pra mim foi mudar a forma de importar os arquivos no HTML e CSS quando estão na mesma pasta, tirando o ./ do começo de alguns imports, por exemplo:

<!-- Antes -->
<img class="logo" src="./assets/logo.png" alt="Logo do Projeto">

<!-- Depois -->
<img class="logo" src="assets/logo.png" alt="Logo do Projeto">

Uma outra opção seria referenciar a imagem pelo link dela direto no GitHub, ao invés de acessar as pastas, tipo assim:

background-image: url("https://raw.githubusercontent.com/{SeuUsuario}/{Repositorio}/main/assets/imagem.png?raw=true");

Só alterando também a main para a sua branch do GitHub e o nome do arquivo.

Essas são duas soluções que você pode tentar, mas para saber exatamente qual é a causa do problema é importante dar uma olhada nas abas do Console e Network das ferramentas de desenvolvedor do seu navegador, para ver se tem alguma mensagem de erro ou resposta com código diferente de 200 na parte de network. Espero ter ajudado um pouquinho!

Breno, obrigado pela resposta. Deu certo na primeira solução que você deu. Porém, eu fiz pelo VS Code Web e fiz um novo branch para subir a melhoria. Bom saber dessas outras formas que você passou para solucionar o problema. :) Valeu!!