Question

我正在尝试部署一个简单的Angular应用程序（使用'ng new'创建的基本应用程序，没有任何更改）。

我已按照本文中的步骤创建了一个供heroku部署的后端服务器： https://medium.com/@hellotunmbi/how-to-deploy-angular-application-to-heroku-1d56e09c5147

我所做的更改使对我有用的步骤使用“ postinstall”：“ ng build --aot --prod”而不是本文中的内容

这是我的server.js的外观：

//Install express server
const express = require('express');
const path = require('path');

const app = express();

// Serve only the static files form the dist directory
app.use(express.static(__dirname + './dist/expense-app'));

// Start the app by listening on the default Heroku port
app.listen(process.env.PORT || 8080);

app.get('/*', function(req,res) {

res.sendFile(path.join(__dirname+'./dist/expense-app/index.html'));
});

这是我的package.json：

{
  "name": "expense-app",
  "version": "0.0.0",
  "scripts": {
    "ng": "ng",
    "start": "ng serve",
    "build": "ng build",
    "test": "ng test",
    "lint": "ng lint",
    "e2e": "ng e2e",
    "postinstall": "ng build --aot --prod"
  },
  "private": true,
  "dependencies": {
    "@angular/cli": "~7.1.0",
    "@angular/compiler-cli": "~7.1.0",
    "@angular/animations": "~7.1.0",
    "@angular/common": "~7.1.0",
    "@angular/compiler": "~7.1.0",
    "@angular/core": "~7.1.0",
    "@angular/forms": "~7.1.0",
    "@angular/platform-browser": "~7.1.0",
    "@angular/platform-browser-dynamic": "~7.1.0",
    "@angular/router": "~7.1.0",
    "core-js": "^2.5.4",
    "express": "^4.16.4",
    "path": "^0.12.7",
    "rxjs": "~6.3.3",
    "tslib": "^1.9.0",
    "zone.js": "~0.8.26",
    "typescript": "~3.1.6"
  },
  "devDependencies": {
    "@angular-devkit/build-angular": "~0.11.0",
    "@angular/language-service": "~7.1.0",
    "@types/jasmine": "~2.8.8",
    "@types/jasminewd2": "~2.0.3",
    "@types/node": "~8.9.4",
    "codelyzer": "~4.5.0",
    "enhanced-resolve": "^3.3.0",
    "jasmine-core": "~2.99.1",
    "jasmine-spec-reporter": "~4.2.1",
    "karma": "~3.1.1",
    "karma-chrome-launcher": "~2.2.0",
    "karma-coverage-istanbul-reporter": "~2.0.1",
    "karma-jasmine": "~1.1.2",
    "karma-jasmine-html-reporter": "^0.2.2",
    "protractor": "~5.4.0",
    "ts-node": "~7.0.0",
    "tslint": "~5.11.0"
  },
  "engines": {
    "node": "8.12.0",
    "npm": "5.5.1"
  }
}

文件文件夹看起来像： files folder

我正在使用heroku git cli部署我的应用程序在我进行更改后，我的应用因H10错误而崩溃，这就是我的日志的样子：

2018-12-03T09:23:22.576448+00:00 heroku[web.1]: Starting process with command `npm start`
2018-12-03T09:23:24.979505+00:00 app[web.1]: 
2018-12-03T09:23:24.979527+00:00 app[web.1]: > expense-app@0.0.0 start /app
2018-12-03T09:23:24.979529+00:00 app[web.1]: > ng serve
2018-12-03T09:23:24.979530+00:00 app[web.1]: 
2018-12-03T09:23:28.123272+00:00 app[web.1]: ** Angular Live Development Server is listening on localhost:4200, open your browser on http://localhost:4200/ **
2018-12-03T09:23:42.374445+00:00 app[web.1]: 
2018-12-03T09:23:42.374461+00:00 app[web.1]: Date: 2018-12-03T09:23:42.373Z
2018-12-03T09:23:42.374462+00:00 app[web.1]: Hash: f147f29ee3d971c171a1
2018-12-03T09:23:42.374463+00:00 app[web.1]: Time: 14035ms
2018-12-03T09:23:42.374468+00:00 app[web.1]: chunk {main} main.js, main.js.map (main) 9.73 kB [initial] [rendered]
2018-12-03T09:23:42.374470+00:00 app[web.1]: chunk {polyfills} polyfills.js, polyfills.js.map (polyfills) 223 kB [initial] [rendered]
2018-12-03T09:23:42.374471+00:00 app[web.1]: chunk {runtime} runtime.js, runtime.js.map (runtime) 6.08 kB [entry] [rendered]
2018-12-03T09:23:42.374473+00:00 app[web.1]: chunk {styles} styles.js, styles.js.map (styles) 16.3 kB [initial] [rendered]
2018-12-03T09:23:42.374478+00:00 app[web.1]: chunk {vendor} vendor.js, vendor.js.map (vendor) 3.43 MB [initial] [rendered]
2018-12-03T09:23:42.394912+00:00 app[web.1]: [34mℹ[39m [90m｢wdm｣[39m: Compiled successfully.
2018-12-03T09:24:23.225141+00:00 heroku[web.1]: Error R10 (Boot timeout) -> Web process failed to bind to $PORT within 60 seconds of launch
2018-12-03T09:24:23.225262+00:00 heroku[web.1]: Stopping process with SIGKILL
2018-12-03T09:24:23.328427+00:00 heroku[web.1]: Process exited with status 137
2018-12-03T09:25:06.336905+00:00 heroku[router]: at=error code=H20 desc="App boot timeout" method=GET path="/" host=***.herokuapp.com request_id=fc5a5d9c-bd39-40f1-b48d-0dd1ec85c776 fwd="194.90.186.65" dyno= connect= service= status=503 bytes= protocol=https
2018-12-03T09:25:41.641532+00:00 heroku[web.1]: State changed from starting to down
2018-12-03T09:26:19.346754+00:00 heroku[router]: at=error code=H20 desc="App boot timeout" method=GET path="/" host=***.herokuapp.com request_id=85badbc2-f4e5-487b-a977-2a088660d875 fwd="194.90.186.65" dyno= connect= service= status=503 bytes= protocol=https
2018-12-03T09:26:22.145485+00:00 heroku[router]: at=error code=H20 desc="App boot timeout" method=GET path="/" host=***.herokuapp.com request_id=d777f0ab-1f1f-4989-86a3-d58b7e98c304 fwd="194.90.186.65" dyno= connect= service= status=503 bytes= protocol=https
2018-12-03T09:26:49.673005+00:00 heroku[router]: at=error code=H10 desc="App crashed" method=GET path="/" host=***.herokuapp.com request_id=3a0d7059-1462-448c-9f07-43c1f19f6a30 fwd="194.90.186.65" dyno= connect= service= status=503 bytes= protocol=https
2018-12-03T09:26:50.180438+00:00 heroku[router]: at=error code=H10 desc="App crashed" method=GET path="/favicon.ico" host=***.herokuapp.com request_id=9c61691d-d5ca-4746-a021-b2077cbba5d1 fwd="194.90.186.65" dyno= connect= service= status=503 bytes= protocol=https

当我进入heroku应用程序域时，我得到了heroku“应用程序错误”页面 heroku application error

我在这里错过了什么吗？它应该很简单，但我无法为我工作

如果您需要更多信息，请告诉我

谢谢，奥伦

Answer 1

尝试删除这些行，看看应用程序是否在没有这些行的情况下运行：

app.get('/*', function(req,res) {
    res.sendFile(path.join(__dirname+'./dist/expense-app/index.html'));
});

此行已将您的index.html设置为默认

app.use(express.static(__dirname + './dist/expense-app'));

还要确保在package.json文件中的“脚本”下有此行：

"start": "node server.js",
"postinstall": "ng build --aot -prod"

基本的Angular应用程序在本地无法在heroku上运行-出现H10崩溃错误

1 个答案: