重新加载不适用于 heroku 上的 mern 堆栈

Reload not working with mern stack on heroku

我已经使用以下代码将我的 mern 堆栈部署到 heroku:

import express from "express";
import path from "path";

const app = express();
const port = process.env.PORT || 5000;

app.get("/health-check", (req, res) => {
  res.sendStatus(200);
});

if (process.env.NODE_ENV === "production") {
  app.use(express.static("client/build"));
  app.get("/*", function (req, res) {
    res.sendFile(path.join(__dirname, "./client/build/index.html"));
  });
}

app.listen(port, () => console.log(`Listening on port ${port}`));

我的网站和使用 react-router-dom 的路由工作得很好。 但是我有两个问题无法解决。

  1. 当我重新加载页面时,我看到一个空白页面,其中包含此消息 + 控制台中的一条错误消息:

Not Found (blank page with this message)

GET https://website.herokuapp.com/login 404 (Not Found)

  1. 当我第一次打开应用程序时,我在控制台中打印了这个错误:

Failed to load resource: the server responded with a status of 404 (Not Found)

我不知道如何消除这些错误,因为我已经关注了 Whosebug 和 youtube 上的每个答案。

如有任何帮助,我们将不胜感激。

非常感谢。

一段时间后找到答案

因为我是 typescript 用户并且我的索引文件在 src 文件夹中我忘了返回一级。

"../client/build/index.html"

而不是

"./client/build/index.html"

完整 index.ts:

if (process.env.NODE_ENV === "production") {
  app.use(express.static("client/build"));
  app.get("*", (req, res) => {
    res.sendFile(path.join(__dirname, "../client/build/index.html"));
  });
}