본문으로 바로가기
COMMUNITY모든 이야기

React production 빌드 후 서버 배포 시 Client-side Routing 404 오류

빗방울 2026.10.30 02:10 2분 읽기 조회 4

React Router를 사용하여 SPA를 구축하고 Nginx 서버에 정적 파일로 배포했습니다. 메인 페이지에서는 정상 작동하나, 브라우저 새로고침 또는 직접 URL 입력 시 404 Not Found 오류가 발생합니다.

코드:

import { BrowserRouter, Routes, Route } from 'react-router-dom';

function App() {
  return (
    <BrowserRouter>
      <Routes>
        <Route path="/" element={<div>Home</div>} />
        <Route path="/about" element={<div>About</div>} />
      </Routes>
    </BrowserRouter>
  );
}

export default App;

오류: 404 Not Found (Nginx default error page)

시도: `npm run build` 후 `dist` 폴더의 내용을 서버 root에 배치함. 로컬 개발 서버(`npm start`)에서는 정상 작동 확인.

질문: Nginx 설정에서 모든 요청을 `index.html`로 리다이렉트하여 React Router가 경로를 제어하게 하려면 `try_files` 설정을 어떻게 구성해야 합니까?

모든 이야기1455

가벼운 안부부터 깊은 생각까지, 함께 나눠요.

글쓰기
총 1455개의 이야기
댓글