git

GitHub에 React로 배포하기

NiceKHJ 2025. 1. 18. 11:30

 

깃허브에 파일을 올린뒤


1. Settings -> Pages -> Branch에서 main 선택 후 Save(저장)을 해준다.

 

 

저장 후 일정 시간(몇분 정도)이 지나면 페이지가 생성됨

 

 

2. gh-pages 패키지 설치

 

 

2-1. 패키지 설치 후 package.json의 scripts에 predeploy와 deploy 추가

 

2-2. package.json 상단에 hompage 추가 (본인 페이지 입)

 

2-3. Git Hub에 배포 명령어 실행

 

3. GitHub 브런치 main -> gh-pages로 변경

[Setting] -> [Pages] -> [Branch]

 

배포 끝

 

# React 프로젝트에서 react-router-dom 을 사용할때 배포 시 URL 주소 관련된 문제가 발생할 수 있다(빈 화면 뜸)

BrowserRouter에 basename을 추가한 후에 다시 push하고 deploy를 하면 해결할 수 있다.

BrowserRouter에 basename 사용하면 새로고침할때 404에러가 뜰수있다.

 

배포후 새로고침할때 404에러가 뜨면 BrowserRouter말고 HashRouter를 사용하면 해결할 수 있다.

basename은 지운다.