Блог

Мое приложение react отлично работает на localhost, а серверная часть (node js) также отлично работает на localhost, но когда я развернул его на Heroku, он показывает пустую страницу.

Для развертывания я создал Procfile, в котором я ссылался на файл сервера

 web: node ./server/index.js
 

который также включает:

 app.use(express.static(__dirname   '../client/build'));
app.get("/*", (req, res) =>
    res.sendFile(path.resolve(__dirname, "../client/build", "index.html"))
);
 

Когда я запускаю приложение, я получаю пустую страницу

Консоль, которую я получаю:

 Uncaught SyntaxError: Unexpected token '<'
main.679eafbe.chunk.js:1 
Uncaught SyntaxError: Unexpected token '<'
manifest.json:1 Manifest: Line: 1, column: 1, Syntax error.
 

После поиска я убедился, что:

• Приложение react создано: npm create-react-app my-app
• У меня нет реквизитов домашней страницы в моем package.json для приложения react
• Я создал приложение react, которое находится в папке client в разделе MyApp после создания

 Uncaught SyntaxError: Unexpected token '<'
main.679eafbe.chunk.js:1 
 

Эта ошибка означает, что ваш сервер возвращает HTML при обработке main.679eafbe.chunk.js .

Это означает express.static , что, вероятно, не соответствует этому пути, и запрос передается в ваше промежуточное ПО html.

Это либо потому main.679eafbe.chunk.js , что не существует в каталоге client / build, либо express.static неправильно настроено.

Если бы я хотел угадать, я бы предложил изменить root ваш переход express.static , чтобы он соответствовал пути, который вы используете в промежуточном программном обеспечении html, например

 app.use(express.static(path.resolve(__dirname, "../client/build"))); // path.resolve was missing here
app.get("/*", (req, res) =>
    res.sendFile(path.resolve(__dirname, "../client/build", "index.html"))
);