GitHub / React gh-pages 배포 빌드 후 빈화면 / BrowserRouter 라우팅 문제해결

리엑트로 만든 프로젝트를 gh-pages 를 통해 배포했다.

근데 흰화면으로 아무것도 보이지 않는다..이게뭐징.. CRA로 새로만들어 테스트 할땐 잘되었는데 뭐지..

알고보니 react-router-dom 의 BrowserRouter가 문제였다.

 

라우팅설정은 꼭 하기 때문에 처음이라면 이경험은 한번씩 다 하는것 같다.

해결방법은 베이스 URL을 설정해주면 된다.

하지만 해결하고 나니 나는BrowserRouter 대신 ConnectRouter를 사용하고 있었다..ㅋㅋ

두개는 패키지가 다르다..일단 react-router-dom 의 BrowserRouter 해결방법이다.

 

BrowserRouter 해결방법은 두가지다.

나는 1번만 해보고 2번은 해보지 않았다.

 

1.  BrowserRouter에 basename을 추가한다.

환경변수 저장해서 썼다. ( 환경변수말고 직접넣어줘도 잘되긴 한다. )내 프로젝트 이름은 socar 였다. /저장소이름/

2. BrowserRouter 대신에 HashRouter를 사용한다

 

위와 같이 BrowserRouter로 해결했는데 ConnectRouter를 쓰고 있었다. ConnectRouter는 basename을 지원하지 않는다.

history에서 설정해준다음 porps를 넘겨준다. 다음 포스팅에 써야징 ㅎㅎ