[Git] gh-pages로 사이트 배포하기

[작업환경 및 package]

• React 환경에서 작업을 진행
• gh-pages를 이용

* gh-pages를 install해준다.

npm install gh-pages
yarn add gh-pages

 

* 아래의 사진처럼 package.json 하단에 "homepage"를 추가해준다.

• https://나의 git ID.github.id/나의 repo 이름

 

* package.json안의 scripts부분에 deploy를 추가해준다.

• "deploy" : "gh-pages -d build"
• (참고) build를 하고 deploy를 해야한다.
• build를 하고 deploy하기 귀찮으니 predeploy(deploy하기전 행동)를 이용하여 deploy가 되었을때 자동으로 build가 될 수 있도록 한다.

---

* React - gh-pages & 빈화면,배경 만 나오는 현상 발생할 경우

  <Router basename={process.env.PUBLIC_URL}>

• basename을 설정 해주면 된다. (기본 URL을 설정해주는 props)

 

(응용) github action을 이용하여서 push할 경우 자동으로 deploy되게끔 셋팅 가능