GitHub.io 블로그에 Chirpy 테마 적용하기
블로그 테마는 Chirpy 테마로 하기로 했다. 인기있는 테마기도 하고, 이쁘고 깔끔해보였기 때문이다.
아래는 Chirpy 테마(자꾸 크리스피라고 읽게 된다) 적용 과정과 겪은 문제들을 정리한 내용이다. 반성해야 할 점은 공식 문서 확인을 안하고 진행했다는 점이다.
무턱대고 한 것치곤 돌아가긴 하는데, 조만간 공식 가이드를 참조해서 다시 진행할 생각이다…혹시 읽고 있는 사람이 있다면 따라하지 마시길.
1. Chirpy 테마 다운로드
Chirpy 테마를 적용하기 위해 Chirpy GitHub 저장소에서 zip 파일을 다운로드하고, 압축을 풀었다.
2. Chirpy 파일 복사
기존에 작성했던 Post 파일만 남기고 나머지 파일들을 전부 덮어쓰면 될 거라고 생각했는데, 기존 테마와 충돌이 발생했다. 그래서 프로젝트 디렉토리를 전부 비운 다음(기존 포스트들은 깃에 백업되어 있기 때문에 괜찮았다) Chirpy 레포의 파일들을 그대로 복사해왔다.
3. 의존성 설치
Chirpy 테마를 위해 필요한 의존성을 설치했다.
1
bundle install
이 명령어는 해당 레포의 Gemfile에 정의된 모든 의존성 라이브러리를 설치해준다. 이후, 다음 명령어를 통해 로컬 환경에서 변경된 테마를 확인할 수 있었다.
1
bundle exec jekyll serve
http://localhost:4000/ 에서 새 테마를 적용한 블로그를 확인할 수 있었다. 이제 백업해놨던 기존 포스트와 about 페이지만 복구하면 되겠다고 생각했다…그리고 복구한 포스트가 로컬에 반영이 안됐다. 공식문서에서 하라는 대로 안했으면서 되는 게 이상한 거긴 했다.
4. config.yml 포함한 여러 설정
_config.yml 등에서 기본 구성 설정을 변경해야 했다.
이렇게 변경했다.
5. Build and deployment에서 설정 변경
이제 로컬에서는 변경사항이 . 반영되었으나 실제 GitHu. .io 페이지에서는 적용이 안 되었다. 구글링해본 결과, main branch로 build시 gh-page branch가 자동으로 생성되어야 한다는데 나는 gh-page 브랜치가 생성되지 않았고 그래서 적용이 안되는 건가 싶었다.
이를 해결하기 위해 일단 repo의 Settings-Pages-Build and deployment에서 소스를 Deploy from a branch에서 GitHub Actions으로 변경했고, save해서 Create ... 커밋을 남겼다(사실 이 부분 잘 모른다. 공부해야겠다).
6. 에러 및 문제 해결 기록
아래는 Actions 탭에서 확인한, 워크플로우의 자동 빌드 및 배포 과정에서 발생한 오류들이다.
6.1 플랫폼 이슈
Gemfile.lock 파일에서 플랫폼이 맞지 않아 발생한 오류를 다음 명령어로 해결했다.
1
bundle lock --add-platform x86_64-linux
6.2 Ruby 버전 이슈
Ruby 버전 호환성 문제로 인해 오류가 발생했다. jekyll.yml 파일에서 Ruby 버전을 3.2.2로 수동 변경했다.
6.3 dist/bootstrap 디렉토리 오류
dist/bootstrap 디렉토리를 찾을 수 없다는 에러가 발생했다. jekyll.yml 파일에 다음과 같이 빌드 과정을 추가했다.
name: npm build
run: npm install && npm run build
아이고 산만하다…아무튼 간신히 성공했다. 앞으로는 공식 문서를 꼭 확인하자.
엄청 도움이 된 자료들이다.