Heroku＆React部署成功，但出現應用程序錯誤

Question

我的構建和應用程序部署成功，但是我的應用程序仍然無法部署。 我嘗試過更改服務器端口，更新我的依賴關系，重新部署，重建和重新提交。 我不知道該怎么辦。

我已經盡我所能想到的一切，任何幫助將不勝感激！ 我的服務器出問題了嗎？ 或者是別的什么？ 幫我！

我的服務器文件：

import express from 'express';
import path from 'path';
import open from 'open';

/* eslint-disable no-console */

const PORT = 8080;
const app = express();

app.use(express.static('dist'));

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

app.listen(process.env.PORT || 5000);

我的Heroku日志：

2018-02-02T05:19:53.000000+00:00 app[api]: Build succeeded
2018-02-02T05:20:22.907775+00:00 heroku[web.1]: Restarting
2018-02-02T05:20:24.372493+00:00 heroku[web.1]: Starting process with command `npm start`
2018-02-02T05:20:26.106642+00:00 app[web.1]:
2018-02-02T05:20:26.106660+00:00 app[web.1]: > get_happy@1.0.0 prestart /app
2018-02-02T05:20:26.106662+00:00 app[web.1]: > babel-node ./tools/startMessage.js
2018-02-02T05:20:26.106664+00:00 app[web.1]:
2018-02-02T05:20:27.101748+00:00 app[web.1]: starting app in dev mode...
2018-02-02T05:20:27.126230+00:00 app[web.1]:
2018-02-02T05:20:27.126233+00:00 app[web.1]: > get_happy@1.0.0 start /app
2018-02-02T05:20:27.126235+00:00 app[web.1]: > npm-run-all --parallel open:src lint:watch test:watch
2018-02-02T05:20:27.126237+00:00 app[web.1]:
2018-02-02T05:20:27.758657+00:00 heroku[web.1]: Starting process with command `npm start`
2018-02-02T05:20:27.777930+00:00 app[web.1]:
2018-02-02T05:20:27.777950+00:00 app[web.1]: > get_happy@1.0.0 test:watch /app
2018-02-02T05:20:27.777952+00:00 app[web.1]: > npm run test -- --watch
2018-02-02T05:20:27.777954+00:00 app[web.1]:
2018-02-02T05:20:27.786621+00:00 app[web.1]:
2018-02-02T05:20:27.786624+00:00 app[web.1]: > get_happy@1.0.0 open:src /app
2018-02-02T05:20:27.786626+00:00 app[web.1]: > babel-node tools/srcServer.js
2018-02-02T05:20:27.786628+00:00 app[web.1]:
2018-02-02T05:20:27.813779+00:00 app[web.1]:
2018-02-02T05:20:27.813784+00:00 app[web.1]: > get_happy@1.0.0 lint:watch /app
2018-02-02T05:20:27.813786+00:00 app[web.1]: > npm run lint -- --watch
2018-02-02T05:20:27.813788+00:00 app[web.1]:
2018-02-02T05:20:28.134869+00:00 app[web.1]:
2018-02-02T05:20:28.134882+00:00 app[web.1]: > get_happy@1.0.0 test /app
2018-02-02T05:20:28.134885+00:00 app[web.1]: > mocha --reporter spec tools/testSetup.js"src/**/*.test.js" "--watch"
2018-02-02T05:20:28.134887+00:00 app[web.1]:
2018-02-02T05:20:28.207190+00:00 app[web.1]: > esw webpack.config.* src tools "--watch"
2018-02-02T05:20:28.207180+00:00 app[web.1]:
2018-02-02T05:20:28.207185+00:00 app[web.1]: > get_happy@1.0.0 lint /app
2018-02-02T05:20:28.207195+00:00 app[web.1]:
2018-02-02T05:20:28.420239+00:00 app[web.1]:
2018-02-02T05:20:29.434664+00:00 app[web.1]:
2018-02-02T05:20:29.434687+00:00 app[web.1]: > get_happy@1.0.0 prestart /app
2018-02-02T05:20:29.434689+00:00 app[web.1]: > babel-node ./tools/startMessage.js
2018-02-02T05:20:29.434691+00:00 app[web.1]:
2018-02-02T05:20:30.374402+00:00 app[web.1]: ✓ Clean (05:20:30)
2018-02-02T05:20:30.374420+00:00 app[web.1]:
2018-02-02T05:20:30.624534+00:00 app[web.1]:   SignUpPage via React Test Utils
2018-02-02T05:20:30.552948+00:00 app[web.1]:
2018-02-02T05:20:30.553304+00:00 app[web.1]:
2018-02-02T05:20:30.457582+00:00 app[web.1]: starting app in dev mode...
2018-02-02T05:20:30.479740+00:00 app[web.1]:
2018-02-02T05:20:30.479743+00:00 app[web.1]: > get_happy@1.0.0 start /app
2018-02-02T05:20:30.479745+00:00 app[web.1]: > npm-run-all --parallel open:src lint:watch test:watch
2018-02-02T05:20:30.479746+00:00 app[web.1]:
    ✓ renders first div842+00:00 app[web.1]:
2018-02-02T05:20:30.631440+00:00 app[web.1]:
2018-02-02T05:20:30.634135+00:00 app[web.1]:   First test
    ✓ should pass30.634139+00:00 app[web.1]:
2018-02-02T05:20:30.634141+00:00 app[web.1]:
2018-02-02T05:20:30.634142+00:00 app[web.1]:
2018-02-02T05:20:30.634144+00:00 app[web.1]:   2 passing (81ms)
2018-02-02T05:20:30.634146+00:00 app[web.1]:
2018-02-02T05:20:31.220493+00:00 app[web.1]:
2018-02-02T05:20:31.220506+00:00 app[web.1]: > get_happy@1.0.0 open:src /app
2018-02-02T05:20:31.220508+00:00 app[web.1]: > babel-node tools/srcServer.js
2018-02-02T05:20:31.220510+00:00 app[web.1]:
2018-02-02T05:20:31.239017+00:00 app[web.1]:
2018-02-02T05:20:31.239022+00:00 app[web.1]: > get_happy@1.0.0 test:watch /app
2018-02-02T05:20:31.239025+00:00 app[web.1]:
2018-02-02T05:20:31.239024+00:00 app[web.1]: > npm run test -- --watch
2018-02-02T05:20:31.254555+00:00 app[web.1]: > get_happy@1.0.0 lint:watch /app
2018-02-02T05:20:31.254557+00:00 app[web.1]: > npm run lint -- --watch
2018-02-02T05:20:31.254559+00:00 app[web.1]:
2018-02-02T05:20:31.254550+00:00 app[web.1]:
2018-02-02T05:20:31.702985+00:00 app[web.1]:
2018-02-02T05:20:31.703000+00:00 app[web.1]: > get_happy@1.0.0 test /app
2018-02-02T05:20:31.703002+00:00 app[web.1]: > mocha --reporter spec tools/testSetup.js"src/**/*.test.js" "--watch"
2018-02-02T05:20:31.703004+00:00 app[web.1]:
2018-02-02T05:20:31.767588+00:00 app[web.1]:
2018-02-02T05:20:31.767592+00:00 app[web.1]: > get_happy@1.0.0 lint /app
2018-02-02T05:20:31.767594+00:00 app[web.1]: > esw webpack.config.* src tools "--watch"
2018-02-02T05:20:31.767596+00:00 app[web.1]:
2018-02-02T05:20:32.060004+00:00 app[web.1]:
2018-02-02T05:20:34.387707+00:00 app[web.1]: webpack built e6aa51ace7cefd89072d in 5132ms
2018-02-02T05:20:34.389564+00:00 app[web.1]: ✓ Clean (05:20:34)
2018-02-02T05:20:34.389580+00:00 app[web.1]:
2018-02-02T05:20:34.594360+00:00 app[web.1]:
2018-02-02T05:20:34.594692+00:00 app[web.1]:
2018-02-02T05:20:34.651197+00:00 app[web.1]:   SignUpPage via React Test Utils
2018-02-02T05:20:34.658270+00:00 app[web.1]:
    ✓ should pass34.659761+00:00 app[web.1]:
    ✓ renders first div544+00:00 app[web.1]:
2018-02-02T05:20:34.660412+00:00 app[web.1]:   2 passing (66ms)
2018-02-02T05:20:34.658541+00:00 app[web.1]:   First test
2018-02-02T05:20:34.660524+00:00 app[web.1]:
2018-02-02T05:20:34.659878+00:00 app[web.1]:
2018-02-02T05:20:34.660221+00:00 app[web.1]:
2018-02-02T05:20:39.845456+00:00 app[web.1]: webpack built e6aa51ace7cefd89072d in 6512ms
2018-02-02T05:20:45.480480+00:00 app[web.1]: Error waiting for process to terminate: Nochild processes
2018-02-02T05:20:45.448861+00:00 heroku[web.1]: Stopping all processes with SIGTERM
2018-02-02T05:20:45.556771+00:00 heroku[web.1]: Process exited with status 22
2018-02-02T05:21:27.875540+00:00 heroku[web.1]: Error R10 (Boot timeout) -> Web processfailed to bind to $PORT within 60 seconds of launch
2018-02-02T05:21:27.875691+00:00 heroku[web.1]: Stopping process with SIGKILL
2018-02-02T05:21:28.025829+00:00 heroku[web.1]: State changed from starting to crashed
2018-02-02T05:21:28.011800+00:00 heroku[web.1]: Process exited with status 137
2018-02-02T05:21:29.827718+00:00 heroku[router]: at=error code=H10 desc="App crashed" method=GET path="/" host=roadtripadventuremap.herokuapp.com request_id=17fd46a1-817b-4501-9312-7bfe7a5a718d fwd="169.234.121.183" dyno= connect= service= status=503 bytes= protocol=https
2018-02-02T05:21:30.947465+00:00 heroku[router]: at=error code=H10 desc="App crashed" method=GET path="/favicon.ico" host=roadtripadventuremap.herokuapp.com request_id=8a9a2659-55aa-44fc-9514-b0877b09a50a fwd="169.234.121.183" dyno= connect= service= status=503 bytes= protocol=https

Answer 1

根據您的項目並參考此內容，請閱讀我的正確設置

https://ditrospecta.com/javascript/react/es6/webpack/heroku/2015/08/08/deploying-react-webpack-heroku.html

看起來您的啟動功能不是您要在npm start上運行的意思，因為它不會啟動dist服務器。 由於heroku在默認情況下嘗試運行npm start，因此它就像啟動開發人員一樣啟動。

我將package.json中的“腳本”更改為

"scripts": {
    "prestart": "babel-node ./tools/startMessage.js",
    "start-dev": "npm-run-all --parallel open:src lint:watch test:watch",
    "start": "node tools/distServer.js",
    "open:src": "babel-node tools/srcServer.js",
    "lint": "node_modules/.bin/esw webpack.config.* src tools",
    "lint:watch": "npm run lint -- --watch",
    "test": "mocha --reporter spec tools/testSetup.js \"src/**/*.test.js\"",
    "test:watch": "npm run test -- --watch",
    "clean-dist": "npm run remove-dist && mkdir dist",
    "remove-dist": "node_modules/.bin/rimraf ./dist",
    "build:html": "babel-node tools/buildHtml.js",
    "prebuild": "npm-run-all clean-dist test lint build:html",
    "build": "babel-node tools/build.js",
    "postbuild": "babel-node tools/distServer.js"
},

您還必須刪除import語句才能在heroku服務器上工作，因此將distServer.js更改為

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

/* eslint-disable no-console */

const PORT = 8080;
const app = express();

app.use(express.static('dist'));

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

app.listen(process.env.PORT || 5000);