为什么我的 react 应用总是在 Heroku 上崩溃？答案

【问题标题】：Why does my react app keep crashing on Heroku?为什么我的 react 应用总是在 Heroku 上崩溃？
【发布时间】：2016-06-27 13:49:28
【问题描述】：

我不相信我有任何要添加的配置变量... 我在 package.json 中添加了 npm start。

这是我的 server.js var app = express();

var compiler = webpack(config);

app.use(webpackDevMiddleware(compiler, {noInfo: true, publicPath: config.output.publicPath}));
app.use(webpackHotMiddleware(compiler));

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

app.use('/', function (req, res) {
    res.sendFile(path.resolve('client/index.html'));
});

var port = 8080;

app.listen(port, function(error) {
  if (error) throw error;
  console.log("Express server listening on port", port);
});

Heroku 活动日志

2016-06-27T05:26:06.606689+00:00 app[web.1]: > POM@0.3.1 start /app
2016-06-27T05:26:06.970312+00:00 app[web.1]: Express server listening on port 8080
2016-06-27T05:26:12.086607+00:00 app[web.1]: webpack built ece2fe8356b0c26f2ade in 5135ms
2016-06-27T05:26:44.560624+00:00 heroku[router]: at=error code=H20 desc="App boot timeout" method=GET path="/" host=pom1.herokuapp.com request_id=77a8ad82-edc4-4dfb-a624-b1a92a5f008c fwd="173.239.65.34" dyno= connect= service= status=503 bytes=
2016-06-27T05:27:04.972688+00:00 heroku[web.1]: Error R10 (Boot timeout) -> Web process failed to bind to $PORT within 60 seconds of launch
enter code here

【问题讨论】：

标签： heroku reactjs heroku-toolbelt

【解决方案1】：

这可能是因为您的应用尚未连接到 heroku 提供的端口。您将通过环境变量获得一个端口号，因此您应该像这样声明您的端口

var port = process.env.PORT || 8080;

这将默认为环境变量中指定的端口（由heroku），如果没有设置，则回退到8080。

我相信 heroku 上的 getting started 部分涉及到这一点以及您应该了解的有关部署到 heroku 的其他几件事，同时还提供了一个 example application。

【讨论】：