[React] vite 프로젝트 + vercel 배포 후 새로고침 404

에러난 시점의 상황

1) React + Vite 로 프로젝트 생성

2) Vercel 에 프로젝트 배포

3) 배포 후 정상적으로 작동하지만 URL을 직접 입력해서 페이지를 이동하거나 라우터 진입 후 새로고침 시 404에러

 

해결한 방법

1) package.json과 같은 위치에 vercel.json 생성 후 아래 코드 입력

{
  "routes": [{ "src": "/[^.]+", "dest": "/", "status": 200 }]
}

 

2) 재배포 후 확인