Jekyll chirpy 테마 검색창 활성화 방법 (.min.js 에러)

포스팅을 작성할 때

로컬에서 깃 페이지 bundle exec jekyll serve로 실행하면

Error “/assets/js/dist/home.min.js” 에러가 발생했었는데

페이지는 잘 표시되서 별 생각없이 넘기고 있었다.

그러나 Chirpy 테마에서 오른쪽 위에 검색어 창에 키워드를 입력해도

검색이 되지 않는 문제가 발생하여 검색해보다

이와 연관이 있는것을 발견했다.

원인 : `Error “/assets/js/dist/home.min.js”

---

• min.js 파일 등이 존재하지 않는 오류
• chirpy 초기 설치시 init 명령어를 수행하면 /assets/js/dist 폴더에 몇가지 js 파일이 생성되어야 하는데, 생성되지 않아 발생하는 문제
• 여기 생성되는 js 파일들은 TOC를 보여주는 기능 등을 수행하는데,
  파일이 없다면 원격 저장소에서도 오류가 발생하고, 로컬에서도 문제가 발생한다고 함

해결 방법

---

1. Node.js 와 npm 설치
2. npm을 이용해 inital 및 build
3. 원격 저장소에 push

1. Node.js 설치

• 위 링크에서 node.js를 받아 설치
• node.js 설치하면 npm은 자동으로 설치된다

2. npm을 이용해 inital 및 build

• powershell 등을 열어 깃페이지 경로로 이동 후 npm install && npm run build 명령어 실행

• NODE_ENV 관련 에러 발생 시 npm install -g win-node-env 명령어로 npm 재설치
• 이후 npm run build 재실행
• min.js 파일들이 생성된다

3. 원격 저장소에 push

• 원격 저장소에도 업로드하기위해 gitignore 파일 수정
• 기본적으로 .min.js 파일은 git에 ignore되어있으므로 이를 없애주어야한다
• .gitignore파일에 assets/js/dist 파일을 주석처리 후 commit, push하면 끝

참조 :
Theme “jekyll-theme-chirpy”

jekyll chirpy 설치 시 발생하는 오류 해결하기

github pages 블로그 만들기 - 테마 적용하기(Chirpy)

Jekyll Chirpy 테마 사용하여 블로그 만들기