React build 하기

참조 : https://devbirdfeet.tistory.com/7

 

리액트 개발 후에

npm run build

npx serve -s build

이렇게 하면 build 폴더 생기면서 압축된 결과 파일들 생성

 

 

 

그러나 build / index.html 을 실행시켜보면 (웹 서버에 올려도) 하얀 화면이 뜨는 이슈

console 보면 Uncaught SyntaxError: Unexpected token < 에러가 뜸

 

아래 방법으로 해결

 

참조 : http://lab.naminsik.com/4011

이 중 방법 2, 방법 3 으로 해결

 

[방법2] package.json 에서 homepage 속성 변경

"homepage": " ~~~ ", ==> "homepage": ".",

 

 

[방법3] public / index.html 상단에 아래 코드 추가해서 캐시를 날림

<meta http-equiv="Cache-Control" content="no-cache, no-store, must-revalidate">
<meta http-equiv="Pragma" content="no-cache">
<meta http-equiv="Expires" content="0">

 

 

 

 

+ 이렇게 했는데도, build 시에 아래 메시지가 뜨면서 하얀 화면이 뜨는 경우가 있어서

Response status is not success redirect_checker.js:569

 

소스를 하나 하나 주석처리하며 보다보니 Router 문제였다.

import { BrowserRouter as Router, Routes, Route, useLocation } from "react-router-dom";

위 코드에서 BrowserRouter as Router 를 HashRouter as Router 로 변경하니 build 완벽하게 잘됨 ㅠㅠㅠㅠㅠ

import { HashRouter as Router, Routes, Route, useLocation } from "react-router-dom";