URL에 index.html을 추가하지 않으면 React 빌드가 제대로 작동하지 않습니다.

Question

저는 React JS 애플리케이션에 해시 라우팅을 사용하고 있습니다. 응용 프로그램은 로컬 환경에서 잘 실행됩니다.

예를 들어 https://stackoverflow.com/posts/는 애플리케이션의 URL이어야 하지만 작동하지 않으며 URL을 만들려면 https://stackoverflow.com/posts/index.html을 사용해야 합니다. 일하다.

배포한 후 빌드 파일에 기본 index.html 파일을 제공하는 대신 "download"라는 이름의 빈 파일을 다운로드하는 것을 확인했습니다. 서버에서 빌드를 실행하기 위해 S3 및 CloudFront 아키텍처를 사용합니다.

지금 당장은 HASH 라우팅이 제대로 작동하지 않는지, 아니면 AWS 배포에 문제가 있는지 알 수 없습니다.

React JS를 사용한 코드 조각

'react'에서 React를 가져옵니다.
'react-dom'에서 ReactDOM을 가져옵니다.
'react-redux'에서 { 제공자 } 가져오기;
'./redux/store'에서 저장소 가져오기;
'./App'에서 앱 가져오기;
'./reportWebVitals'에서 ReportWebVitals 가져오기;
import { HashRouter } from 'react-router-dom/cjs/react-router-dom';

ReactDOM.렌더(
 <공급업체 스토어={스토어}>
    <해시라우터>
      <앱 />
    </해시라우터>
  </공급자>

  document.getElementById('루트')
);

package.json 콘텐츠의 일부

{
  "이름": "loremipsum",
  "버전": "0.1.0",
  "비공개": 사실,
  "홈페이지": "/loremipsum/"
}

Answer 1

하위 디렉터리에 배포해야 합니까? 그렇다면 package.json 文件的内容，以强制相对于 index.html 파일을 변경하여 리소스를 제공해야 합니다.

으아악

이로써 재건축 없이 호스팅http://www.foo 中的应用程序移动到 http://www.foo/relativepath 甚至https://www.foo/bar1/bar2/을 할 수 있게 되었습니다.

또한 파일을 호스팅할 도메인과 하위 디렉터리를 포함하려면 PUBLIC_URL을 재정의해야 합니다