2017-05-29 205 views
0

我試圖在Heroku上運行我的簡單節點應用程序。
這裏是我的server.js(起動點):Heroku應用程序(Express React SSR)崩潰

require('babel-register') 

const express = require('express') 
const React = require('react') 
const ReactDOMServer = require('react-dom/server') 
const ReactRouter = require('react-router') 
const StaticRouter = ReactRouter.StaticRouter 
const _ = require('lodash') 
const fs = require('fs') 
const PORT = process.env.PORT || 8080 
const baseTemplate = fs.readFileSync('./index.html') 
const template = _.template(baseTemplate) 
const App = require('./js/App').default 

const server = express() 
server.use('/_public', express.static('./_public')) 

server.use((req, res) => { 
    const context = {} 
    const body = ReactDOMServer.renderToString(
    React.createElement(StaticRouter, {location: req.url, 
     context: context}, 
    React.createElement(App)) 
) 

    res.write(template({body: body})) 
    res.end() 
}) 

console.log('listening on port', PORT) 

這裏是的package.json

{ 
    "name": "medium", 
    "version": "1.0.0", 
    "description": "SSR react static website", 
    "main": "server.js", 
    "scripts": { 
    "build": "node_modules/.bin/webpack", 
    "dev": "node_modules/.bin/webpack-dev-server", 
    "lint": "eslint js/**/*.js server.js", 
    "watch": "node_modules/.bin/webpack --watch" 
    }, 
    "engines": { 
    "node": "6.10.3" 
    }, 
    }, 
    "keywords": [ 
    "react" 
    ], 
    "dependencies": { 
    "axios": "^0.16.1", 
    "babel-loader": "^7.0.0", 
    "babel-plugin-transform-es2015-modules-commonjs": "^6.24.1", 
    "babel-preset-es2015": "^6.24.1", 
    "babel-preset-react": "^6.24.1", 
    "babel-register": "^6.24.1", 
    "express": "^4.15.3", 
    "history": "^4.6.1", 
    "lodash": "^4.17.4", 
    "react": "^15.5.4", 
    "react-disqus-thread": "^0.4.0", 
    "react-dom": "^15.5.4", 
    "react-google-maps": "^7.0.0", 
    "react-icons": "^2.2.5", 
    "react-redux": "^5.0.5", 
    "react-router": "^4.1.1", 
    "react-router-dom": "^4.1.1", 
    "react-transition-group": "^1.1.3", 
    "reactstrap": "^4.6.2", 
    "redux": "^3.6.0", 
    "redux-thunk": "^2.2.0", 
    "shortid": "^2.2.8" 
... 
} 

在控制檯它打印應用程序的開始XXXX端口。但隨後的應用程序會與下面的消息崩潰

2017-05-29T10:15:13.241869+00:00 heroku[router]: at=error code=H10 desc="App crashed" method=GET path="/" host=medium-if-ua.herokuapp.com request_id=bc8294c4-4754-4875-8cdb-d6921212f7bb fwd="178.136.244.44" dyno= connect= service= status=503 bytes= protocol=https 

回答

0

小的變化我已經制作於server.js
1. server.listen(PORT) - 被偶然刪除,這就是節點服務器一直退出的原因。 enter image description here
2.添加預置babel-register包:
enter image description here
而且畢竟一切工作正常)

0

您可以通過在try/catch塊包裝的渲染和堆棧跟蹤發送錯誤調試問題:

server.use((req, res) => { 
    try { 
    const context = {} 
    const body = ReactDOMServer.renderToString(
     React.createElement(StaticRouter, 
     {location: req.url, context: context}, 
     React.createElement(App) 
    ) 
    ) 

    res.write(template({body: body})) 
    res.end() 
    } catch (error) { 
    const result = [error.message, error.stack].join('\r\n') 
    res.send(result) 
    } 
}) 
+0

怪異嗯,但同樣的結果 - http://i.imgur.com/Svxk6QI.png –

+0

請嘗試' heroku restart「,因爲它似乎可以幫助其他人處理這種情況。 –

+0

不,它沒有幫助( –