[REACT 오류 해결] gh-page 배포 경로 오류

 gh-page로 github에서 리액트 배포한 후 

경로 오류 문제에 봉착했다.

 

이렇게 내가 배포한 주소로 들어가면

첫 페이지가 나오는 것이 아니라

잘못된 경로를 적었을 때 나오는 페이지가 바로 나온다는 것이다.

 

 

 

 

돌아가기를 누르면 내가 설정한 경로가 아닌 

github.io에서 페이지가 정상작동한다

 

 

 

 

구글링을 엄청 해서 방법을 찾았는데

이것은 라우터의 문제라고 한다.

HashRouter로 하면 된다는 말이 있어서

HashRouter로 바깠다가 해결이 안되어서

  <BrowserRouter basename="/react_voca_app">

이렇게 바깥을 감싸는 브라우저라우터에

basename으로 경로를 지정해주니 해결이 되었다.

 

 

이것 때문에 

node- modules를 삭제했다

npm install로 다시 깔았다를 엄청 반복했고

build폴더도 지웠다가

다시 build했다가를 반복하면서 엄청 뻘짓을 했고

Router의 문제인 것을 알고나서는

hash라우터로 바깠다가 지웠다가 엄청 고생을 했다.

 

 

코딩하는 이웃님의 gh-page배포하는 글을 보고

나도 좀 배포를

해볼까나~? 하고 했는데

시박... ㅠㅠㅠ 코린이인 나에게는 너무나 험난한 여정이었다.

흐엉엉엉 ㅠㅠㅠㅠ

 

이제 완벽히 잘 나온다.

https://hallokay.github.io/react_voca_app/

Voca app