在 Heroku 上配置单页 Create-React-App

Posted

技术标签:

【中文标题】在 Heroku 上配置单页 Create-React-App【英文标题】:Configuring a single page Create-React-App on Heroku 【发布时间】:2018-07-08 06:31:23 【问题描述】:

使用 Firebase 托管,当您部署应用时 you are asked 是否将所有 url 重写为 /index.html。这意味着 react-router 路由将被正确触发,无论它们是直接访问还是从主页导航到。

我们使用Create-react-app 和Create-react-app-buildpack 部署到Heroku。我们如何以相同的方式将所有 URL 重写为 /index.html?

在this issue之后,解释了routes指令,我在根目录中配置了一个static.json无济于事:


  "routes": 
    "/images/*": "/images/",
    "/legal/*": "/images/",
    "/media/*": "/media/",
    "/fav/*": "/fav/",
    "/styles/*": "/styles/",
    "/**": "index.html"
  

【问题讨论】:

您可以使用像 serve 这样的实用程序来帮助您。 vijayt.com/post/deploying-react-app-heroku 你也可以通过http-servergithub.com/http-party/http-server/pull/513/files使用这个hack 【参考方案1】:

在项目根目录下创建static.json文件,内容如下:


  "root": "build/",
  "routes": 
    "/**": "index.html"
  

更多here.

【讨论】:

以上是关于在 Heroku 上配置单页 Create-React-App的主要内容,如果未能解决你的问题,请参考以下文章

数据库编辑后无法在我的 Heroku 应用程序上查看用户配置文件

Heroku 上的空白页 - mean.js Angular 应用程序

如何将 React 应用程序部署到 Heroku

Heroku 上带有 Postgresql 的 Django - settings.DATABASES 配置不正确。请提供名称值

在 Heroku 上为 Django 配置 gunicorn

Heroku“无效主机标头”主机配置中的ReactJS APP?