Heroku 無法使用“npm start”啟動應用程序

Question

在我將我的應用程序部署到 heroku 之后，它會構建得很好，但是在它運行啟動腳本之后： npm start它掛起然后最終中斷。 我試過玩弄它，但我所做的一切似乎都沒有讓它在部署后實際運行。 值得一提的是，構建應用程序並在本地啟動它是可行的。 下面是heroku logs --tails的日志輸出和相關代碼。

2019-08-20T16:02:56.000000+00:00 app[api]: Build succeeded
2019-08-20T16:02:58.168780+00:00 heroku[web.1]: Starting process with command `npm start`
2019-08-20T16:03:00.139605+00:00 app[web.1]:
2019-08-20T16:03:00.139625+00:00 app[web.1]: > flexer@1.0.0 start /app
2019-08-20T16:03:00.139627+00:00 app[web.1]: > export NODE_ENV=Production && node src/server.js
2019-08-20T16:03:00.139629+00:00 app[web.1]:
2019-08-20T16:03:00.468869+00:00 app[web.1]: App running at http://localhost:8080
2019-08-20T16:03:00.469522+00:00 app[web.1]: Press Ctrl + C to shut the app down
2019-08-20T16:03:58.258831+00:00 heroku[web.1]: Error R10 (Boot timeout) -> Web process failed to bind to $PORT within 60 seconds of launch
2019-08-20T16:03:58.258968+00:00 heroku[web.1]: Stopping process with SIGKILL
2019-08-20T16:03:58.352312+00:00 heroku[web.1]: State changed from starting to crashed
2019-08-20T16:03:58.356511+00:00 heroku[web.1]: State changed from crashed to starting
2019-08-20T16:03:58.332256+00:00 heroku[web.1]: Process exited with status 137
2019-08-20T16:04:01.054987+00:00 heroku[web.1]: Starting process with command `npm start`
2019-08-20T16:04:03.927374+00:00 app[web.1]:
2019-08-20T16:04:03.927394+00:00 app[web.1]: > flexer@1.0.0 start /app
2019-08-20T16:04:03.927396+00:00 app[web.1]: > export NODE_ENV=Production && node src/server.js
2019-08-20T16:04:03.927398+00:00 app[web.1]:
2019-08-20T16:04:04.265778+00:00 app[web.1]: App running at http://localhost:8080
2019-08-20T16:04:04.265819+00:00 app[web.1]: Press Ctrl + C to shut the app down
2019-08-20T16:04:26.772380+00:00 heroku[router]: at=error code=H20 desc="App boot timeout" method=GET path="/" host=flexer-css.herokuapp.com request_id=df728327-bc5c-4484-b6ff-c5e66c3984e6 fwd="136.36.121.111" dyno= connect= service= status=503 bytes= protocol=https
2019-08-20T16:05:01.601305+00:00 heroku[web.1]: State changed from starting to crashed
2019-08-20T16:05:01.464089+00:00 heroku[web.1]: Error R10 (Boot timeout) -> Web process failed to bind to $PORT within 60 seconds of launch
2019-08-20T16:05:01.464089+00:00 heroku[web.1]: Stopping process with SIGKILL
2019-08-20T16:05:01.573116+00:00 heroku[web.1]: Process exited with status 137
2019-08-20T16:05:02.186635+00:00 heroku[router]: at=error code=H10 desc="App crashed" method=GET path="/" host=flexer-css.herokuapp.com request_id=3a0c387e-a781-4d0b-9db0-208fcc3ee994 fwd="136.36.121.111" dyno= connect= service= status=503 bytes= protocol=https
2019-08-20T16:05:02.740563+00:00 heroku[router]: at=error code=H10 desc="App crashed" method=GET path="/favicon.ico" host=flexer-css.herokuapp.com request_id=40e04b18-7e6d-4f41-b7fb-ffdfeb49331e fwd="136.36.121.111" dyno= connect= service= status=503 bytes= protocol=https

包.json：

{
  "name": "flexer",
  "version": "1.0.0",
  "engines": {
    "node": "10.14.2",
    "npm": "6.9.0"
  },
  "description": "Flexbox generator",
  "main": "index.js",
  "scripts": {
    "start:dev": "export NODE_ENV=Development && webpack-dev-server --open --config webpack.dev.js",
    "start": "export NODE_ENV=Production && node src/server.js",
    "build": "webpack --config webpack.prod.js"
  },
  "author": "Dakota Ruller",
  "license": "ISC",
  "devDependencies": {
    "@babel/core": "^7.5.5",
    "@babel/node": "^7.5.5",
    "@babel/plugin-proposal-class-properties": "^7.5.5",
    "@babel/preset-env": "^7.5.5",
    "@babel/preset-react": "^7.0.0",
    "babel-loader": "^8.0.6",
    "clean-webpack-plugin": "^3.0.0",
    "css-loader": "^3.0.0",
    "file-loader": "^4.0.0",
    "html-loader": "^0.5.5",
    "html-webpack-plugin": "^3.2.0",
    "node-sass": "^4.12.0",
    "nodemon": "^1.19.1",
    "sass-loader": "^7.1.0",
    "style-loader": "^0.23.1",
    "webpack": "^4.36.1",
    "webpack-cli": "^3.3.6",
    "webpack-dev-server": "^3.7.2",
    "webpack-merge": "^4.2.1",
    "webpack-node-externals": "^1.7.2"
  },
  "dependencies": {
    "axios": "^0.19.0",
    "body-parser": "^1.19.0",
    "compression": "^1.7.4",
    "express": "^4.17.1",
    "path": "^0.12.7",
    "react": "^16.8.6",
    "react-dom": "^16.8.6",
    "react-redux": "^7.1.0",
    "redux": "^4.0.4"
  }
}

服務器.js

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

const server = express();
const PORT = 8080 || process.env.PORT;

const DIST_DIR = path.join(__dirname, '../dist');
const HTML_FILE = path.join(DIST_DIR, 'index.html');

server.use(express.static(DIST_DIR));
server.use(compression);

server.get('/', (req, res) => {
  res.sendFile(HTML_FILE);
});

server.listen(PORT, () => {
  console.log(`App running at http://localhost:${PORT}`);
  console.log("Press Ctrl + C to shut the app down");
});

我對使用 heroku 進行部署非常陌生，因此將不勝感激任何建議/幫助。

Answer 1

Heroku 會為你分配一個端口來運行， 你不要選擇它。 所以這里的問題是你試圖綁定到端口 8080 而 Heroku 不允許你，如日志的第 9 行所示。 移除8080 || 在PORT變量中，直接綁定到$PORT環境變量：

const PORT = process.env.PORT;

Answer 2

將您的應用程序綁定到所需端口似乎存在問題，而是嘗試將您的應用程序綁定到您將用於本地開發的端口 8080。

2019-08-20T16:05:01.464089+00:00 heroku[web.1]: 錯誤 R10（啟動超時）-> Web 進程未能在啟動后 60 秒內綁定到 $PORT

嘗試將您的端口邏輯更改為以下內容：

const PORT = process.env.PORT || 8080

您當前的代碼始終假定端口為 8080，但這是在您在 Heroku 上部署應用程序時動態分配的。 您當前的邏輯是相反的，通過此更改，無論您是在本地開發還是將 Web 應用程序部署到 Heroku，您的應用程序都將正常工作。

這個語句的邏輯如下：

對於本地開發，條件的第一部分：動態分配端口的位置將為 false，因此您的代碼將回退到端口 8080。但是，當部署到 Heroku 時，此端口環境變量將在 Heroku 結束時動態分配，所以你的本地端口不會被使用。

希望這有幫助！

Answer 3

看起來就像上面的人所說的端口綁定是問題，因為npm start是啟動服務器，而在 dep 上，您可能不需要明確提及端口#