Question

我知道这个主题有很多问题，但是我已经尝试了一切，但还是没有运气。

我的index.js文件中有这个

const routing = (
  <HashRouter basename={process.env.PUBLIC_URL}>
    <div>
      <Route exact path="/" component={Home} />
      <Route path="/year_2019" render={(props) => <Year {...props} year={`2019`} />} />
      <Route path="/year_2018" render={(props) => <Year {...props} year={`2018`} />} />
      <Route path="/year_2017" render={(props) => <Year {...props} year={`2017`} />} />
      <Route path="/year_2016" render={(props) => <Year {...props} year={`2016`} />} />
      <Route path="/decade" render={(props) => <Year {...props} year={`Decade`} />} />
      <Route path="/ShowAlbums" component={ShowAlbums} />
      <Route path="/ShowSongs" component={ShowSongs} />
      <Route path="/collage" component={Collage} />
    </div>
  </HashRouter>
)

ReactDOM.render(routing, document.getElementById('root'));

我的package.json中有这个

{
  "name": "albums-site",
  "version": "0.1.0",
  "private": true,
  "homepage": "https://mrkerr.github.io/react-music",
  "dependencies": {
    "@testing-library/jest-dom": "^4.2.4",
    "@testing-library/react": "^9.3.3",
    "@testing-library/user-event": "^7.1.2",
    "gh-pages": "^2.1.1",
    "react": "^16.12.0",
    "react-burger-menu": "^2.6.13",
    "react-dom": "^16.12.0",
    "react-router": "^5.1.2",
    "react-router-dom": "^5.1.2",
    "react-scripts": "3.3.0",
    "react-twitter-embed": "^3.0.3",
    "react-typed": "^1.2.0"
  },
  "scripts": {
    "start": "react-scripts start",
    "predeploy": "npm run build",
    "deploy": "gh-pages -d build",
    "build": "react-scripts build",
    "test": "react-scripts test",
    "eject": "react-scripts eject"
  },
  "eslintConfig": {
    "extends": "react-app"
  },
  "browserslist": {
    "production": [
      ">0.2%",
      "not dead",
      "not op_mini all"
    ],
    "development": [
      "last 1 chrome version",
      "last 1 firefox version",
      "last 1 safari version"
    ]
  }
}

而我的index.html

中有这个

    <link rel="manifest" href="%PUBLIC_URL%/manifest.json" />

我运行npm run deploy并转到https://mrkerr.github.io/react-music/，它加载了index.html，但为manifest.json给出了404，并为{{1}说了net::ERR_ABORTED 404 }。我不确定还有什么尝试，非常感谢您的帮助！

Answer 1

您所有的资产链接都解析为错误的URL。具体来说，资产的路径中有一个额外的mrkerr，它并不完全位于它们的位置。

特别是对于manifest.json，浏览器正在尝试下载 https://mrkerr.github.io/mrkerr/react-music/manifest.json代替 https://mrkerr.github.io/react-music/manifest.json

我认为解决方案是将package.json中的“主页”更改为"homepage": "https://mrkerr.github.io/react-music"。

可能还有另一个配置选项设置了PUBLIC_URL变量错误。

在gh页面上显示Reacts应用程序，显示404静态文件

1 个答案: