React Build funktioniert nicht ordnungsgemäß, ohne index.html in der URL hinzuzufügen
P粉216203545
P粉216203545 2023-09-01 11:25:58
0
1
491
<p>Ich verwende Hash-Routing für eine React JS-Anwendung. Die Anwendung läuft in der lokalen Umgebung einwandfrei. </p> <p>Zum Beispiel sollte https://stackoverflow.com/posts/ die URL der Anwendung sein, aber es funktioniert nicht und ich muss https://stackoverflow.com/posts/index.html verwenden, um es zu erstellen arbeiten. </p> <p>Nach der Bereitstellung ist mir aufgefallen, dass eine leere Datei mit dem Namen „<strong>download</strong>“ heruntergeladen wurde, anstatt die Standarddatei <strong>index.html</strong> bereitzustellen. Um Builds auf dem Server auszuführen, verwende ich die S3- und CloudFront-Architektur. </p> <p>Im Moment kann ich nicht sagen, ob sich das HASH-Routing schlecht verhält oder ob etwas mit der AWS-Bereitstellung nicht stimmt. </p> <p>Code-Snippet mit React JS</p> <pre class="brush:php;toolbar:false;">import React from 'react'; ReactDOM aus „react-dom“ importieren; import { Provider } from 'react-redux'; Shop aus „./redux/store“ importieren; App aus './App' importieren; importiere reportWebVitals aus './reportWebVitals'; import { HashRouter } from 'react-router-dom/cjs/react-router-dom'; ReactDOM.render( <Provider store={store}> <HashRouter> <App /> </HashRouter> </Anbieter> document.getElementById('root') );</pre> <p><strong>Teil des package.json-Inhalts</strong></p> <pre class="brush:php;toolbar:false;">{ "Name": "Loremipsum", „Version“: „0.1.0“, "privat": wahr, "Homepage": "/loremipsum/" }</pre></p>
P粉216203545
P粉216203545

Antworte allen(1)
P粉515066518

是否需要部署在子目录上?如果是,您将必须更改 package.json 文件的内容,以强制相对于 index.html 文件提供资源。

{
  "name": "loremipsum",
  "version": "0.1.0",
  "private": true,
  "homepage": ".",
  "scripts": {
    "build": "react-scripts build",
    "build-prd": "PUBLIC_URL=http://www.foo/relativepath react-scripts build"
    // ...
  }
}

有了这个,我们将能够将托管在 http://www.foo 中的应用程序移动到 http://www.foo/relativepath 甚至https://www.foo/bar1/bar2/ 无需重建。

您还必须覆盖 PUBLIC_URL 以包含您想要托管文件的域和子目录

Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage