WebpackアプリケーションをHerokuにデプロイするときに、 "Webプロセスが起動から60秒以内に$ PORTにバインドできませんでした"

WebpackアプリケーションをHerokuにデプロイしようとしています。私は私のProcfileのコマンドとして 'npm run dev'を使用しています。私はWebPACKの-DEV-server.jsにを

DEFAULT_PORT = process.env.port || 8080

を設定しているHerokuのは、私のアプリを実行しますが、それは言ってクラッシュ：

Web process failed to bind to $PORT within 60 seconds of launch

をあなたは以下の私のログと.jsonファイルを見ることができます。私はかなり混乱しています。ここで

2017-12-12T22:53:21.995212+00:00 app[web.1]:  + 41 hidden modules 
2017-12-12T22:53:21.995212+00:00 app[web.1]: Child html-webpack-plugin for "index.html": 
2017-12-12T22:53:21.995216+00:00 app[web.1]:  [2] (webpack)/buildin/global.js 509 bytes {0} [built] 
2017-12-12T22:53:21.995213+00:00 app[web.1]:  1 asset 
2017-12-12T22:53:21.995214+00:00 app[web.1]:  [0] ./node_modules/html-webpack-plugin/lib/loader.js!./src/index.html 1.4 kB {0} [built] 
2017-12-12T22:53:21.995215+00:00 app[web.1]:  [1] ./node_modules/lodash/lodash.js 540 kB {0} [built] 
2017-12-12T22:53:21.995219+00:00 app[web.1]:  [0] ./node_modules/css-loader!./src/css/style.css 830 bytes {0} [built] 
2017-12-12T22:53:21.995216+00:00 app[web.1]:  [3] (webpack)/buildin/module.js 517 bytes {0} [built] 
2017-12-12T22:53:21.995219+00:00 app[web.1]:  [1] ./node_modules/css-loader/lib/css-base.js 2.26 kB {0} [built] 
2017-12-12T22:53:21.995224+00:00 app[web.1]: webpack: Compiled successfully. 
2017-12-12T22:53:21.995218+00:00 app[web.1]: Child extract-text-webpack-plugin node_modules/extract-text-webpack-plugin/dist node_modules/css-loader/index.js!src/css/style.css: 
2017-12-12T22:54:13.856117+00:00 heroku[web.1]: Error R10 (Boot timeout) -> Web process failed to bind to $PORT within 60 seconds of launch 
2017-12-12T22:54:13.856117+00:00 heroku[web.1]: Stopping process with SIGKILL 
2017-12-12T22:54:13.973488+00:00 heroku[web.1]: Process exited with status 137 
2017-12-12T22:54:13.988182+00:00 heroku[web.1]: State changed from starting to crashed 
2017-12-12T22:54:13.990564+00:00 heroku[web.1]: State changed from crashed to starting 
2017-12-12T22:54:18.192737+00:00 heroku[web.1]: Starting process with command `npm run dev` 
2017-12-12T22:54:27.691608+00:00 app[web.1]: Project is running at http://localhost:59703/ 
2017-12-12T22:54:27.691900+00:00 app[web.1]: webpack output is served from/
2017-12-12T22:54:30.791009+00:00 app[web.1]: Hash: 40cb4c337991c9ef0121 
2017-12-12T22:54:30.791029+00:00 app[web.1]: Version: webpack 3.10.0 
2017-12-12T22:54:30.791031+00:00 app[web.1]: Time: 3102ms 
2017-12-12T22:54:30.791032+00:00 app[web.1]:   Asset  Size Chunks     Chunk Names 
2017-12-12T22:54:30.791033+00:00 app[web.1]: app.bundle.js 1.05 MB  0 [emitted] [big] main 
2017-12-12T22:54:30.791034+00:00 app[web.1]: style.bundle.css 617 bytes  0 [emitted]   main 
2017-12-12T22:54:30.791035+00:00 app[web.1]:  index.html 1.14 kB   [emitted]   
2017-12-12T22:54:30.791035+00:00 app[web.1]: [2] ./node_modules/react/index.js 190 bytes {0} [built] 
2017-12-12T22:54:30.791036+00:00 app[web.1]: [10] ./node_modules/react-dom/index.js 1.36 kB {0} [built] 
2017-12-12T22:54:30.791037+00:00 app[web.1]: [17] multi (webpack)-dev-server/client?http://localhost:59703 ./src/js/app.jsx 40 bytes {0} [built] 
2017-12-12T22:54:30.791038+00:00 app[web.1]: [18] (webpack)-dev-server/client?http://localhost:59703 7.95 kB {0} [built] 
2017-12-12T22:54:30.791038+00:00 app[web.1]: [19] ./node_modules/url/url.js 23.3 kB {0} [built] 
2017-12-12T22:54:30.791039+00:00 app[web.1]: [26] ./node_modules/strip-ansi/index.js 161 bytes {0} [built] 
2017-12-12T22:54:30.791039+00:00 app[web.1]: [28] ./node_modules/loglevel/lib/loglevel.js 7.86 kB {0} [built] 
2017-12-12T22:54:30.791040+00:00 app[web.1]: [29] (webpack)-dev-server/client/socket.js 1.05 kB {0} [built] 
2017-12-12T22:54:30.791041+00:00 app[web.1]: [31] (webpack)-dev-server/client/overlay.js 3.73 kB {0} [built] 
2017-12-12T22:54:30.791042+00:00 app[web.1]: [36] (webpack)/hot nonrecursive ^\.\/log$ 170 bytes {0} [built] 
2017-12-12T22:54:30.791043+00:00 app[web.1]: [37] (webpack)/hot/log.js 1.04 kB {0} [optional] [built] 
2017-12-12T22:54:30.791043+00:00 app[web.1]: [38] (webpack)/hot/emitter.js 77 bytes {0} [built] 
2017-12-12T22:54:30.791044+00:00 app[web.1]: [40] ./src/js/app.jsx 451 bytes {0} [built] 
2017-12-12T22:54:30.791045+00:00 app[web.1]: [52] ./src/components/App.jsx 3.48 kB {0} [built] 
2017-12-12T22:54:30.791046+00:00 app[web.1]: [54] ./src/css/style.css 41 bytes {0} [built] 
2017-12-12T22:54:30.791047+00:00 app[web.1]:  + 41 hidden modules 
2017-12-12T22:54:30.791047+00:00 app[web.1]: Child html-webpack-plugin for "index.html": 
2017-12-12T22:54:30.791048+00:00 app[web.1]:  1 asset 
2017-12-12T22:54:30.791049+00:00 app[web.1]:  [0] ./node_modules/html-webpack-plugin/lib/loader.js!./src/index.html 1.4 kB {0} [built] 
2017-12-12T22:54:30.791050+00:00 app[web.1]:  [1] ./node_modules/lodash/lodash.js 540 kB {0} [built] 
2017-12-12T22:54:30.791050+00:00 app[web.1]:  [2] (webpack)/buildin/global.js 509 bytes {0} [built] 
2017-12-12T22:54:30.791051+00:00 app[web.1]:  [3] (webpack)/buildin/module.js 517 bytes {0} [built] 
2017-12-12T22:54:30.791052+00:00 app[web.1]: Child extract-text-webpack-plugin node_modules/extract-text-webpack-plugin/dist node_modules/css-loader/index.js!src/css/style.css: 
2017-12-12T22:54:30.791053+00:00 app[web.1]:  [0] ./node_modules/css-loader!./src/css/style.css 830 bytes {0} [built] 
2017-12-12T22:54:30.791054+00:00 app[web.1]:  [1] ./node_modules/css-loader/lib/css-base.js 2.26 kB {0} [built] 
2017-12-12T22:54:30.791084+00:00 app[web.1]: webpack: Compiled successfully. 
2017-12-12T22:54:26.379844+00:00 app[web.1]: 
2017-12-12T22:54:26.379885+00:00 app[web.1]: > [email protected] dev /app 
2017-12-12T22:54:26.379886+00:00 app[web.1]: > webpack-dev-server 
2017-12-12T22:54:26.379887+00:00 app[web.1]: 
2017-12-12T22:54:49.900296+00:00 heroku[router]: at=error code=H20 desc="App boot timeout" method=GET path="/" host=rapperapplication.herokuapp.com request_id=3ab024a0-4ec0-4e90-9508-a701cf0c596e fwd="73.236.18.255" dyno= connect= service= status=503 bytes= protocol=https 
2017-12-12T22:55:18.669392+00:00 heroku[web.1]: Process exited with status 137 
2017-12-12T22:55:18.680949+00:00 heroku[web.1]: State changed from starting to crashed 
2017-12-12T22:55:18.551666+00:00 heroku[web.1]: Error R10 (Boot timeout) -> Web process failed to bind to $PORT within 60 seconds of launch 
2017-12-12T22:55:18.551666+00:00 heroku[web.1]: Stopping process with SIGKILL 
2017-12-12T22:55:21.000471+00:00 heroku[router]: at=error code=H10 desc="App crashed" method=GET path="/" host=rapperapplication.herokuapp.com request_id=bfda82f0-f194-47a1-ac40-11daddf4b9a8 fwd="73.236.18.255" dyno= connect= service= status=503 bytes= protocol=https 
2017-12-12T22:55:21.791196+00:00 heroku[router]: at=error code=H10 desc="App crashed" method=GET path="/favicon.ico" host=rapperapplication.herokuapp.com request_id=2f3821a1-f17b-486c-83bb-084a413b6298 fwd="73.236.18.255" dyno= connect= service= status=503 bytes= protocol=https

は私.JSONファイルです：

 { 
     "name": "rapperapplication", 
     "version": "1.0.0", 
     "description": "display information about rappers", 
     "main": "app.js", 
     "scripts": { 
     "build": "webpack", 
     "dev": "webpack-dev-server" 
     }, 
     "keywords": [ 
     "rappers" 
     ], 
     "author": "Daniel Sigut", 
     "license": "ISC", 
     "devDependencies": { 
     "babel-core": "^6.26.0", 
     "babel-loader": "^7.1.2", 
     "babel-preset-env": "^1.6.1", 
     "babel-preset-react": "^6.24.1", 
     "css-loader": "^0.28.7", 
     "extract-text-webpack-plugin": "^3.0.2", 
     "file-loader": "^1.1.5", 
     "html-webpack-plugin": "^2.30.1", 
     "webpack": "^3.10.0", 
     "webpack-dev-server": "^2.9.7" 
     }, 
     "dependencies": { 
     "react": "^16.2.0", 
     "react-dom": "^16.2.0", 
     "react-router-dom": "^4.2.2" 
     } 
    }

そして最後に、ここで私のapp.jsxファイルです：

import React from 'react'; 
import { render } from 'react-dom'; 
import App from '../components/App' 
import '../css/style.css'; 

render((
    <App /> 
), document.getElementById('app'));

出典

2017-12-12 Daniel Sigut

あなたの「app.js」メインファイルが見えなくても、あなたを助けるのは難しいです。または、ログを生成するコードがどこにあるのか。 – midnightsyntax

@midnightsyntax app.jsxファイルを追加しました。 –

まあ、男は、私はそれを考え出しました...プロジェクトを提供するためにserver.jsファイルが必要でした。私はそれが簡単だとは信じられません。私の大胆なwebpackアプリを提供するために使用したコードの投稿...

これは私のプロジェクトのルートにあるserver.jsファイルです。

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

app.use(express.static(__dirname + '/dist/')); 
app.use('/src/assets', express.static(__dirname + '/src/assets/')); 


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

祝福された週を過ごしてください！

出典

2017-12-13 01:32:23

私はserver/index.jsファイルを正しくファイルを構築するための/distフォルダを指しています。

Procfileとwebpackの設定を見てみることはできますか？

我々はそれをserverが私たちの特急サーバーのフォルダである。このような

/*Procfile:*/ 
web: ./node_modules/webpack/bin/webpack.js && node --optimize_for_size --max_old_space_size=460 --gc_interval=100 server

を起動しているserver/index.js

出典

2018-02-22 11:40:56 elQueFaltaba

あなたがノードに

ウェブを使用している場合は、あなたのprocfileは次のようになります

：ノードインデックスを.js

相対パスを使用すると、サーバーファイルの名前を入れないでください

私は助けてくれるといいです

出典

2018-03-07 18:59:26

WebpackアプリケーションをHerokuにデプロイするときに、 "Webプロセスが起動から60秒以内に$ PORTにバインドできませんでした"

答えて

関連する問題