Мое приложение работает локально, но на Heroku я просто получаю логотип React

Question

Когда я запускаю свое приложение локально, оно работает просто отлично. Я развернул свое приложение на Heroku, и сборка прошла без ошибок. Однако всякий раз, когда я открываю приложение, я просто получаю вращающуюся страницу со значком React, которая появляется при первом создании приложения реагирования. Я ничего не получаю в консоли, а журнал Heroku возвращает мне статус 200, поэтому я не уверен, что происходит.

Я заметил, что это как-то связано с моей папкой сборки, потому что когда я удаляю приложение возвращает "Not Found".

Я считаю, что это на моем сервере. js file.

require("dotenv").config();
const express = require('express');
const port = process.env.PORT || 8080;
const path = require("path");

var app = express();

app.use(express.urlencoded({ extended: true }));
app.use(express.json());
if (process.env.NODE_ENV === "production") {
    app.use(express.static("client/build"));
}





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

app.listen(port, (req, res) => {
    console.log(`server listening on localhost:${port}`);
});

Я только что попытался скопировать из приложения, которое я успешно запустил на heroku. Я довольно новичок в кодировании, поэтому я даже не знаю, что это значит. Если бы кто-то мог мне помочь, это было бы очень признательно.

Answer 1

Я понял это. У меня не было сценария сборки в моем пакете. json

Answer 2

Это, вероятно, потому что вы используете create-react-app и не обслуживаете папку /build. Для этого можно легко добавить сервер express.

Сначала установите модуль express:

npm install express --save

И добавьте файл server.js, который будет обслуживать ваш /build/index.html по всем запросам:

const path = require('path');
const express = require('express');

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

app.use(express.static(path.join(__dirname, 'build')));

app.get('*', (req, res) => {
  res.sendFile(path.join(__dirname, 'build/index.html'));
});

app.listen(port, () => {
  console.log(`The server is running at http://localhost:${port}`);
});