suchen

Heim  >  Fragen und Antworten  >  Hauptteil

React Build funktioniert nicht ordnungsgemäß, ohne index.html in der URL hinzuzufügen

<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粉216203545P粉216203545439 Tage vor458

Antworte allen(1)Ich werde antworten

  • P粉515066518

    P粉5150665182023-09-02 00:44:52

    是否需要部署在子目录上?如果是,您将必须更改 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 以包含您想要托管文件的域和子目录

    Antwort
    0
  • StornierenAntwort