我通常使用create-react-app制作应用程序......但我尝试使用webpack。我正在学习本教程：https://www.adrianprieto.com/building-a-react-js-app-from-scratch-in-10-steps/
与Heroku有一些问题。该应用程序非常简单。字面上两个组件只有文本。它在当地工作正常。但是当我尝试在Heroku上发射时，它就会失速。这是Heroku日志：
2018-02-14T14:43:34.679287+00:00 app[api]: Enable Logplex by user jackseabolt@gmail.com
2018-02-14T14:43:34.577090+00:00 app[api]: Release v1 created by user jackseabolt@gmail.com
2018-02-14T14:43:34.679287+00:00 app[api]: Release v2 created by user jackseabolt@gmail.com
2018-02-14T14:43:34.577090+00:00 app[api]: Initial release by user jackseabolt@gmail.com
2018-02-14T14:47:33.000000+00:00 app[api]: Build started by user jackseabolt@gmail.com
2018-02-14T14:47:52.513572+00:00 app[api]: Deploy 69edb643 by user jackseabolt@gmail.com
2018-02-14T14:47:52.531533+00:00 app[api]: Scaled to web@1:Free by user jackseabolt@gmail.com
2018-02-14T14:47:52.513572+00:00 app[api]: Release v3 created by user jackseabolt@gmail.com
2018-02-14T14:47:33.000000+00:00 app[api]: Build succeeded
2018-02-14T14:47:56.429389+00:00 heroku[web.1]: Starting process with command `npm start`
2018-02-14T14:47:58.193319+00:00 app[web.1]:
2018-02-14T14:47:58.193341+00:00 app[web.1]: > star-quizes-client@1.0.0 start /app
2018-02-14T14:47:58.193343+00:00 app[web.1]: > webpack-dev-server --hot
2018-02-14T14:47:58.193345+00:00 app[web.1]:
2018-02-14T14:47:59.336099+00:00 app[web.1]: Project is running at http://localhost:8080/
2018-02-14T14:47:59.336586+00:00 app[web.1]: webpack output is served from /
2018-02-14T14:48:01.683126+00:00 app[web.1]: Hash: fad1ddf0709d9e61457e
2018-02-14T14:48:01.683131+00:00 app[web.1]: Version: webpack 3.11.0
2018-02-14T14:48:01.683133+00:00 app[web.1]: Time: 2336ms
2018-02-14T14:48:01.683140+00:00 app[web.1]: Asset Size Chunks Chunk Names
2018-02-14T14:48:01.683149+00:00 app[web.1]: [10] (webpack)/hot/emitter.js 77 bytes {0} [built]
2018-02-14T14:48:01.683142+00:00 app[web.1]: index.js 1.08 MB 0 [emitted] [big] main
2018-02-14T14:48:01.683147+00:00 app[web.1]: [2] ./node_modules/react/index.js 190 bytes {0} [built]
2018-02-14T14:48:01.683148+00:00 app[web.1]: [5] (webpack)/hot/log.js 1.04 kB {0} [built]
2018-02-14T14:48:01.683152+00:00 app[web.1]: [18] multi (webpack)-dev-server/client?http://localhost:8080 webpack/hot/dev-server ./main.js 52 bytes {0} [built]
2018-02-14T14:48:01.683154+00:00 app[web.1]: [19] (webpack)-dev-server/client?http://localhost:8080 7.91 kB {0} [built]
2018-02-14T14:48:01.683155+00:00 app[web.1]: [20] ./node_modules/url/url.js 23.3 kB {0} [built]
2018-02-14T14:48:01.683170+00:00 app[web.1]: + 41 hidden modules
2018-02-14T14:48:01.683166+00:00 app[web.1]: [41] ./main.js 480 bytes {0} [built]
2018-02-14T14:48:01.683158+00:00 app[web.1]: [29] ./node_modules/loglevel/lib/loglevel.js 7.86 kB {0} [built]
2018-02-14T14:48:01.683175+00:00 app[web.1]: webpack: Compiled successfully.
2018-02-14T14:48:01.683159+00:00 app[web.1]: [30] (webpack)-dev-server/client/socket.js 1.08 kB {0} [built]
2018-02-14T14:48:01.683169+00:00 app[web.1]: [54] ./components/App.js 2.44 kB {0} [built]
2018-02-14T14:48:01.683160+00:00 app[web.1]: [32] (webpack)-dev-server/client/overlay.js 3.67 kB {0} [built]
2018-02-14T14:48:01.683161+00:00 app[web.1]: [37] (webpack)/hot nonrecursive ^\.\/log$ 170 bytes {0} [built]
2018-02-14T14:48:01.683162+00:00 app[web.1]: [39] (webpack)/hot/dev-server.js 1.61 kB {0} [built]
2018-02-14T14:48:01.683164+00:00 app[web.1]: [40] (webpack)/hot/log-apply-result.js 1.31 kB {0} [built]
2018-02-14T14:48:01.683168+00:00 app[web.1]: [45] ./node_modules/react-dom/index.js 1.36 kB {0} [built]
2018-02-14T14:48:56.915037+00:00 heroku[web.1]: Error R10 (Boot timeout) -> Web process failed to bind to $PORT within 60 seconds of launch
2018-02-14T14:48:56.915096+00:00 heroku[web.1]: Stopping process with SIGKILL
2018-02-14T14:48:57.007714+00:00 heroku[web.1]: Process exited with status 137
2018-02-14T14:48:57.023034+00:00 heroku[web.1]: State changed from starting to crashed
2018-02-14T14:48:57.026046+00:00 heroku[web.1]: State changed from crashed to starting
2018-02-14T14:49:00.597853+00:00 heroku[web.1]: Starting process with command `npm start`
2018-02-14T14:49:02.550597+00:00 app[web.1]:
2018-02-14T14:49:02.550622+00:00 app[web.1]: > star-quizes-client@1.0.0 start /app
2018-02-14T14:49:02.550626+00:00 app[web.1]: > webpack-dev-server --hot
2018-02-14T14:49:02.550628+00:00 app[web.1]:
2018-02-14T14:49:03.916803+00:00 app[web.1]: Project is running at http://localhost:8080/
2018-02-14T14:49:03.917353+00:00 app[web.1]: webpack output is served from /
2018-02-14T14:49:05.989275+00:00 app[web.1]: Hash: fad1ddf0709d9e61457e
2018-02-14T14:49:05.989282+00:00 app[web.1]: Version: webpack 3.11.0
2018-02-14T14:49:05.989284+00:00 app[web.1]: Time: 2083ms
2018-02-14T14:49:05.989286+00:00 app[web.1]: Asset Size Chunks Chunk Names
2018-02-14T14:49:05.989288+00:00 app[web.1]: index.js 1.08 MB 0 [emitted] [big] main
2018-02-14T14:49:05.989290+00:00 app[web.1]: [2] ./node_modules/react/index.js 190 bytes {0} [built]
2018-02-14T14:49:05.989292+00:00 app[web.1]: [5] (webpack)/hot/log.js 1.04 kB {0} [built]
2018-02-14T14:49:05.989293+00:00 app[web.1]: [10] (webpack)/hot/emitter.js 77 bytes {0} [built]
2018-02-14T14:49:05.989295+00:00 app[web.1]: [18] multi (webpack)-dev-server/client?http://localhost:8080 webpack/hot/dev-server ./main.js 52 bytes {0} [built]
2018-02-14T14:49:05.989297+00:00 app[web.1]: [19] (webpack)-dev-server/client?http://localhost:8080 7.91 kB {0} [built]
2018-02-14T14:49:05.989299+00:00 app[web.1]: [20] ./node_modules/url/url.js 23.3 kB {0} [built]
2018-02-14T14:49:05.989300+00:00 app[web.1]: [29] ./node_modules/loglevel/lib/loglevel.js 7.86 kB {0} [built]
2018-02-14T14:49:05.989302+00:00 app[web.1]: [30] (webpack)-dev-server/client/socket.js 1.08 kB {0} [built]
2018-02-14T14:49:05.989303+00:00 app[web.1]: [32] (webpack)-dev-server/client/overlay.js 3.67 kB {0} [built]
2018-02-14T14:49:05.989304+00:00 app[web.1]: [37] (webpack)/hot nonrecursive ^\.\/log$ 170 bytes {0} [built]
2018-02-14T14:49:05.989305+00:00 app[web.1]: [39] (webpack)/hot/dev-server.js 1.61 kB {0} [built]
2018-02-14T14:49:05.989306+00:00 app[web.1]: [40] (webpack)/hot/log-apply-result.js 1.31 kB {0} [built]
2018-02-14T14:49:05.989308+00:00 app[web.1]: [41] ./main.js 480 bytes {0} [built]
2018-02-14T14:49:05.989309+00:00 app[web.1]: [45] ./node_modules/react-dom/index.js 1.36 kB {0} [built]
2018-02-14T14:49:05.989310+00:00 app[web.1]: [54] ./components/App.js 2.44 kB {0} [built]
2018-02-14T14:49:05.989311+00:00 app[web.1]: + 41 hidden modules
2018-02-14T14:49:05.989318+00:00 app[web.1]: webpack: Compiled successfully.
2018-02-14T14:49:32.334810+00:00 heroku[router]: at=error code=H20 desc="App boot timeout" method=GET path="/" host=star-quizes.herokuapp.com request_id=d3e576fb-90c1-4c12-859e-c66cc92f54b7 fwd="73.92.104.22" dyno= connect= service= status=503 bytes= protocol=https
2018-02-14T14:50:01.107846+00:00 heroku[web.1]: Error R10 (Boot timeout) -> Web process failed to bind to $PORT within 60 seconds of launch
2018-02-14T14:50:01.107999+00:00 heroku[web.1]: Stopping process with SIGKILL
2018-02-14T14:50:01.195819+00:00 heroku[web.1]: Process exited with status 137
2018-02-14T14:50:01.207788+00:00 heroku[web.1]: State changed from starting to crashed
2018-02-14T14:50:02.591388+00:00 heroku[router]: at=error code=H10 desc="App crashed" method=GET path="/" host=star-quizes.herokuapp.com request_id=3362ec47-083b-414c-9fbb-c5f69eca2703 fwd="73.92.104.22" dyno= connect= service= status=503 bytes= protocol=https
2018-02-14T14:50:03.351220+00:00 heroku[router]: at=error code=H10 desc="App crashed" method=GET path="/favicon.ico" host=star-quizes.herokuapp.com request_id=2ce90afe-1e8b-4e7c-970c-bc66e4ae2aac fwd="73.92.104.22" dyno= connect= service= status=503 bytes= protocol=https
2018-02-14T14:50:02.647818+00:00 heroku[router]: at=error code=H10 desc="App crashed" method=GET path="/" host=star-quizes.herokuapp.com request_id=b3c38bd2-b1c9-4854-85c3-0a2e34a6dea3 fwd="73.92.104.22" dyno= connect= service= status=503 bytes= protocol=https
2018-02-14T14:55:45.117503+00:00 heroku[router]: at=error code=H10 desc="App crashed" method=GET path="/" host=star-quizes.herokuapp.com request_id=f790117a-1954-45cc-81c4-a03111f269ec fwd="73.92.104.22" dyno= connect= service= status=503 bytes= protocol=https
2018-02-14T14:55:45.370332+00:00 heroku[router]: at=error code=H10 desc="App crashed" method=GET path="/favicon.ico" host=star-quizes.herokuapp.com request_id=7b3f485d-95ed-4a8e-b223-d6130c594b16 fwd="73.92.104.22" dyno= connect= service= status=503 bytes= protocol=https
Johns-MacBook-Pro:star-quizes-client johnseabolt$
这是我的webpack配置文件：
var config = {
entry: './main.js', // entry point
output: {
filename: 'index.js', // place where bundled app will be served
},
devServer: {
inline: true, // autorefresh
port: 8080 // development port server
},
module: {
loaders: [
{
test: /\.jsx?$/, // search for js files
exclude: /node_modules/,
loader: 'babel-loader',
query: {
presets: ['es2015', 'react'] // use es2015 and react
}
}
]
}
}
module.exports = config;
再次，从教程中复制粘贴。但有些事情是不对的。
Package.json：
{
"name": "star-quizes-client",
"version": "1.0.0",
"description": "",
"main": "index.js",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1",
"start": "webpack-dev-server --hot"
},
"author": "",
"license": "ISC",
"dependencies": {
"babel-core": "^6.26.0",
"babel-loader": "^7.1.2",
"babel-preset-es2015": "^6.24.1",
"babel-preset-react": "^6.24.1",
"react": "^16.2.0",
"react-dom": "^16.2.0",
"webpack": "^3.11.0",
"webpack-dev-server": "^2.11.1"
}
}
该应用需要花费两分钟时间进行部署，这可能是一个线索？通常使用create-react-app在我的计算机上部署15秒。