时间戳

首页 > 解决方案 > 托管在 Heroku 上的 React 应用程序无法打开具有超过 1 个段的 URL 的页面

reactjs - 托管在 Heroku 上的 React 应用程序无法打开具有超过 1 个段的 URL 的页面

问题描述

我有一个在 Heroku 上托管的 React Web 应用程序 ( https://muzenda-frontend.herokuapp.com/ )。其他页面显示良好，但当 url 有超过 1 个段时，它只显示白屏。例如https://muzenda-frontend.herokuapp.com/ / 将显示一个空白的白色屏幕。一个实际的例子是https://muzenda-frontend.herokuapp.com/explore/data-scientist。

我的 package.json 包含以下内容

{
  "name": "frontend",
  "proxy": "http://127.0.0.1:5000",
  "version": "0.1.0",
  "private": true,
  "dependencies": {
    "@emotion/react": "^11.1.5",
    "@emotion/styled": "^11.3.0",
    "@material-ui/core": "^5.0.0-alpha.30",
    "@testing-library/jest-dom": "^4.2.4",
    "@testing-library/react": "^9.3.2",
    "@testing-library/user-event": "^7.1.2",
    "axios": "^0.19.2",
    "js-cookie": "^2.2.1",
    "jwt-decode": "^3.1.2",
    "material-ui": "^0.20.2",
    "react": "^16.12.0",
    "react-bootstrap-4-pagination": "^1.0.4",
    "react-cookie-consent": "^6.2.3",
    "react-dom": "^16.12.0",
    "react-field-validator": "^0.2.2",
    "react-infinite-scroll-component": "^6.1.0",
    "react-inputs-validation": "^4.6.3",
    "react-player": "^2.9.0",
    "react-redux": "^7.1.3",
    "react-router-dom": "^5.2.0",
    "react-scripts": "^3.4.1",
    "redux": "^4.0.5",
    "redux-thunk": "^2.3.0",
    "serve": "^12.0.0"
  },
  "scripts": {
    "dev": "react-scripts start",
    "start": "serve -s build",
    "build": "react-scripts build",
    "test": "react-scripts test --env=jsdom",
    "eject": "react-scripts eject",
    "heroku-postbuild": "npm run build"
  },
  "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"
    ]
  },
  "homepage": "."
}

这可能是什么原因造成的？

标签： reactjsheroku

解决方案

推荐阅读