Github Pages 에서 배경 또는 이미지 안나올때 해결법

Github pages 를 이용하여 정적 웹사이트를 구동할때 로컬에서는 잘 나오는 이미지가 나오지 않는 경우가 있다.

대부분의 경우는 경로가 잘못되어 발생한다.

아래와 같이 되어있는경우가 많은데 이경우 이미지를 찾지 못한다.

background-image: url("/images/bg.jpg");

 

왜나하면 절대 경로인 경우 프로젝트의 가장 높은 디렉토리 경로이기 때문에 아래와 같은 경로에서 찾게 되어 존재하지 않는다.

https://id.github.io/images/bg.jpg

 

따라서 해당 경로를 상대경로로 바꾸면 해결된다. 

background-image: url("./images/bg.jpg");