본문 바로가기

GitHub/GitHub Pages

Github Pages build Failure - Jekyll theme 적용중 생긴 문제 ( 미지원 플러그인 )

깃헙 블로그 주소 (클릭)

 

이번에 포트폴리오가 너무 부실하다고 생각이 되어 ( 사실 전엔 포트폴리오 작성 하는법도 몰랐다고 봐야지.. )

github.io 로 블로그사이트를 만들어 포트폴리오를 만들어야겠다는 생각을 했다.

그러다가 적당한 강의가 있길래 시간을 절약하자는 마음에 강의를 구매하고 진행했다.

하지만 거기서는 사용하는 테마중 'hyde-jack-starterkit' 이라는 테마를 사용했는데,

일반적으로 대부분의 강의나 사이트에서 사용하는 가장 간단한 호스팅 방법으로

Fork 나 레포지토리 Push 를 통해 Jekyll theme를 내 레포지토리에 가져오고,

_config.yml 파일에서 url을 자신의 "username.github.io" 형식으로 바꾸고, 레포지토리도 같은 이름으로 변경해주는

너무나도 단순한 방법으로 호스팅을 했었다.

하지만 왠지 나는 이 테마를 적용하려고 하니 Github Pages build failure 만 계속 떴었다... ( 정말 스트레스..... 🤯)

Github pages build Failure

이 오류를 해결하는 과정을 여기에 간략하게나마 작성해보려고 한다.

 

🤷‍♂️ Github Pages build Failure 원인분석 ,,?

먼저 이 문구를 보게되면 진짜 스트레스 받는 이유가 있다.

바로 이유를 알수가 없다는 것이다. ( 저와 같은 case 라면 더더욱 )

이 글을 보고 계신분들 이라면 작성자와 같은 일이 겪지 않았으면 하는 마음에서 이 글을 쓴다.

해결을 위해 수없이 시도한 흔적들...😭

참고로 build Failure가 되면, 깃허브에 가입한 이메일로 메일과 함께 빌드에 실패한 이유를 적어서 보내준다.

그런데 참으로 고맙게도,

🤬

이유를 알수가 없다. ( Page build failed 페이지 빌드에 실패했다,,,,,, 끝????? 🙄)

그런데 미리 말하자면 내가 겪은 오류는 일반적인 오류가 아니었다. ( 출력은 build Failure 및 404 에러 )

구글링을 해보면, 대부분 404 에러는 github pages 자체 오류거나, 호스팅 중에 전산처리 문제가 있어서 안되는것 같다.


  
$ git commit --allow-empty -m "Trigger rebuild"
$ git push


뭐 대충 이런식으로 해결하라는게 대부분의 solution 이었다..

아니면 _config.yml 의 url 항목을 체크 하라던지 ( url : steven-yn.github.io 같은 식으로 입력해야함 )

Repository name 을 url 항목과 동일하게 steven-yn.github.io 로 만들라 던지,,

이런 Ctrl + C V 자동응답기 식 solution 이 대부분 이다.

깃헙 블로그를 포트폴리오로 준비하는 개발자라면, 이런 간단한 문제로 오류가 뜰거라고 생각하지 않는다 😄

 

여튼 위에 나열한 저런 방법들은 모두 기초적인 실수거나,
git command 같은건 그냥 github pages를 리빌드 하기위한 단순한 재 커밋 외엔 아무런 의미도 없다
( 사실 레포지토리 name 을 변경하거나 pages environment 만 변경하기만해도 리빌드가 된다 )

 

여튼 그래서 도데체 뭐가 문젤까?

몇일에 이어진 실패로 지친 나는 원점으로 돌아가 문제점을 찾았다.

먼저, 받은 메일의 내용을 따라 가 봤다.

For information on troubleshooting Jekyll see:

 https://docs.github.com/articles/troubleshooting-jekyll-builds

 

Troubleshooting Jekyll build errors for GitHub Pages sites - GitHub Docs

Troubleshooting build errors If Jekyll encounters an error building your GitHub Pages site locally or on GitHub, you can use error messages to troubleshoot. For more information about error messages and how to view them, see "About Jekyll build errors for

docs.github.com

이러한 창을 볼수가 있다.

내가 겪는 문제의 답은 지원되지 않는 플러그인 에 있었다.

https://docs.github.com/en/pages/setting-up-a-github-pages-site-with-jekyll/about-github-pages-and-jekyll#plugins

jekyll theme 를 사용하게되면, jekyll 에서 제공하는 각종 plugins 를 통해서

- jekyll-paginate - jekyll-sitemap
 

같은 플러그인 들을 활성화 할수가 있다.

그런데 theme 가 개발이 많이 되어있으면 되어 있을수록, 구현하기 복잡하고 있으면 편리한 것들을

제작자가 추가적으로 그 기능들을 구현해 놓은 경우가 많다. ( 우리의 시간은 소중하다 😉 )

현재 이글을 보는 개발자가 자신도 비슷한 에러를 해결하고 있는거 같다면, _config.yml 을 열어 플러그인을 확인하자.

_config.yml

 이렇게 깃헙 문제 해결 페이지와 비교를 해보면, 미지원 플러그인들을 마구 사용중인것을 알수가 있다.

그렇다면 해결 방법은 ? 🙁

 

Solution 

 다양한 해결 방법이 있겠지만, 나는 

GitHub 페이지는 지원되지 않는 플러그인을 사용하여 사이트를 구축할 수 없습니다. 지원되지 않는 플러그인을 사용하려면 사이트를 로컬에서 생성한 다음 사이트의 정적 파일을 GitHub에 푸시하세요.

이 방법으로 해결하였다. 그러니까,,

$ bundle exec jekyll serve

 위와 같이 


  
$ bundle exec jekyll serve
 
 를 하게되면, 로컬에서 jekyll 이 빌드가 된다.

 빌드 하게 되면 _site 폴더 내에 빌드된 "사이트의 정적 파일" 이 들어간다. 

_site

이 파일을 호스팅할 repository 로 push 하면 되는것이다.

그리고 이 과정을 좀더 스무스 하게 할 방법이 있는데,,

https://jr-developers.github.io/blog/2020/12/08/blog1.html

 

Jekyll Github Page 미지원 Plugin 빌드 배포

jekyll-theme를 centrarium로 선택하여 로컬에서는 정상적으로 기동되는 것을 확인하였다.하지만 GitHub 에 Push 후 GitHub Pages에서 기본적으로 지원하는 CI/CD가 이루어져 HTML들이 생성되었지만 jekyll-paginate

jr-developers.github.io

위의 블로그를 참고하여 rake publish 명령어를 사용하면, 자동으로 깃헙 master 브랜치로 push 해준다 !!!(감사합니다 제 생명의 은인 이십니다 😇 )

 

앞으로 사용해봐야 알겠지만, 이 정적 파일 로드 방식이 불편한점이나 큰 단점이 있다면 

방식을 바꿔서 일반적이게 해야겠지만, 일단은 이 상태로 빌드를 하게 될것같다.