Heroku deployment failed? How to deploy Angular App + NodeJs properly?

Question

Here's a log using heroku logs --tail

I don't know what's wrong :(

2019-07-23T14:46:07.163085+00:00 app[api]: Release v1 created by user *************************
2019-07-23T14:46:07.163085+00:00 app[api]: Initial release by user *************************
2019-07-23T14:46:07.294081+00:00 app[api]: Release v2 created by user *************************
2019-07-23T14:46:07.294081+00:00 app[api]: Enable Logplex by user *************************
2019-07-23T18:01:44.000000+00:00 app[api]: Build started by user *************************
2019-07-23T18:03:07.000000+00:00 app[api]: Build failed -- check your build output: https://dashboard.heroku.com/apps/8caccb7a-a433-493d-908c-1a4c74cd9fdd/activity/builds/aed091e8-1bfb-4307-83cf-43ada72e2861
2019-07-23T18:09:36.063934+00:00 heroku[router]: at=info code=H81 desc="Blank app" method=GET path="/" host=test-sales-inventory.herokuapp.com request_id=7616d3f6-076f-4304-a0c2-8500acab1f52 fwd="119.94.134.58" dyno= connect= service= status=502 bytes= protocol=http
2019-07-23T18:09:36.516265+00:00 heroku[router]: at=info code=H81 desc="Blank app" method=GET path="/favicon.ico" host=test-sales-inventory.herokuapp.com request_id=930f88f0-be45-4d53-8b7c-4d853c6feefe fwd="119.94.134.58" dyno= connect= service= status=502 bytes= protocol=http
2019-07-23T18:11:32.000000+00:00 app[api]: Build started by user *************************
2019-07-23T18:12:49.000000+00:00 app[api]: Build failed -- check your build output: https://dashboard.heroku.com/apps/8caccb7a-a433-493d-908c-1a4c74cd9fdd/activity/builds/f3821a02-3652-4d9e-9d42-e31f66082ae5
2019-07-24T03:57:07.991461+00:00 heroku[router]: at=info code=H81 desc="Blank app" method=GET path="/" host=test-sales-inventory.herokuapp.com request_id=ca49428f-93a7-476b-b98e-7d677a399c4b fwd="192.46.82.6" dyno= connect= service= status=502 bytes= protocol=https
2019-07-24T03:57:09.494625+00:00 heroku[router]: at=info code=H81 desc="Blank app" method=GET path="/favicon.ico" host=test-sales-inventory.herokuapp.com request_id=08526607-c300-43d9-9990-24bea733905f fwd="192.46.82.6" dyno= connect= service= status=502 bytes= protocol=https
2019-07-24T05:42:30.000000+00:00 app[api]: Build started by user *************************
2019-07-24T05:43:12.000000+00:00 app[api]: Build failed -- check your build output: https://dashboard.heroku.com/apps/8caccb7a-a433-493d-908c-1a4c74cd9fdd/activity/builds/391584f4-51f0-4d1e-8a32-0e0e872ad633
2019-07-24T05:44:53.000000+00:00 app[api]: Build started by user *************************
2019-07-24T05:46:03.000000+00:00 app[api]: Build failed -- check your build output: https://dashboard.heroku.com/apps/8caccb7a-a433-493d-908c-1a4c74cd9fdd/activity/builds/a145e335-4664-4a14-8534-bce8059d3e45
2019-07-24T05:47:35.409299+00:00 heroku[router]: at=info code=H81 desc="Blank app" method=GET path="/" host=test-sales-inventory.herokuapp.com request_id=adf69c0e-65d4-41f4-bb88-d25b4a0c72d7 fwd="192.46.82.6" dyno= connect= service= status=502 bytes= protocol=http
2019-07-24T05:47:36.211822+00:00 heroku[router]: at=info code=H81 desc="Blank app" method=GET path="/favicon.ico" host=test-sales-inventory.herokuapp.com request_id=9009ad97-58ec-4faa-a69a-09d0acfcf895 fwd="192.46.82.6" dyno= connect= service= status=502 bytes= protocol=http
2019-07-24T05:48:48.000000+00:00 app[api]: Build started by user *************************
2019-07-24T05:52:39.551161+00:00 app[api]: Deploy 99fb36a8 by user *************************
2019-07-24T05:52:39.551161+00:00 app[api]: Release v3 created by user *************************
2019-07-24T05:52:39.571172+00:00 app[api]: Scaled to web@1:Free by user *************************
2019-07-24T05:52:46.260351+00:00 heroku[web.1]: Starting process with command `npm start`
2019-07-24T05:52:49.243475+00:00 heroku[web.1]: State changed from starting to crashed
2019-07-24T05:52:49.248877+00:00 heroku[web.1]: State changed from crashed to starting
2019-07-24T05:52:49.161557+00:00 app[web.1]:
2019-07-24T05:52:49.161578+00:00 app[web.1]: > [email protected] start /app
2019-07-24T05:52:49.161580+00:00 app[web.1]: > ng serve
2019-07-24T05:52:49.161581+00:00 app[web.1]:
2019-07-24T05:52:49.166940+00:00 app[web.1]: sh: 1: ng: not found
2019-07-24T05:52:49.170658+00:00 app[web.1]: npm ERR! file sh
2019-07-24T05:52:49.170864+00:00 app[web.1]: npm ERR! code ELIFECYCLE
2019-07-24T05:52:49.171023+00:00 app[web.1]: npm ERR! errno ENOENT
2019-07-24T05:52:49.171203+00:00 app[web.1]: npm ERR! syscall spawn
2019-07-24T05:52:49.172192+00:00 app[web.1]: npm ERR! [email protected] start: `ng serve`
2019-07-24T05:52:49.172292+00:00 app[web.1]: npm ERR! spawn ENOENT
2019-07-24T05:52:49.172500+00:00 app[web.1]: npm ERR!
2019-07-24T05:52:49.172620+00:00 app[web.1]: npm ERR! Failed at the [email protected] start script.
2019-07-24T05:52:49.172723+00:00 app[web.1]: npm ERR! This is probably not a problem with npm. There is likely additional logging output above.
2019-07-24T05:52:49.179364+00:00 app[web.1]:
2019-07-24T05:52:49.179517+00:00 app[web.1]: npm ERR! A complete log of this run can be found in:
2019-07-24T05:52:49.179606+00:00 app[web.1]: npm ERR!     /app/.npm/_logs/2019-07-24T05_52_49_174Z-debug.log
2019-07-24T05:52:49.222034+00:00 heroku[web.1]: Process exited with status 1
2019-07-24T05:52:54.000000+00:00 app[api]: Build succeeded
2019-07-24T05:52:55.609389+00:00 heroku[web.1]: Starting process with command `npm start`
2019-07-24T05:52:57.560798+00:00 heroku[web.1]: State changed from starting to crashed
2019-07-24T05:52:57.538094+00:00 heroku[web.1]: Process exited with status 1
2019-07-24T05:52:57.439444+00:00 app[web.1]:
2019-07-24T05:52:57.439464+00:00 app[web.1]: > [email protected] start /app
2019-07-24T05:52:57.439466+00:00 app[web.1]: > ng serve
2019-07-24T05:52:57.439467+00:00 app[web.1]:
2019-07-24T05:52:57.477143+00:00 app[web.1]: sh: 1: ng: not found
2019-07-24T05:52:57.481380+00:00 app[web.1]: npm ERR! file sh
2019-07-24T05:52:57.481590+00:00 app[web.1]: npm ERR! code ELIFECYCLE
2019-07-24T05:52:57.481731+00:00 app[web.1]: npm ERR! errno ENOENT
2019-07-24T05:52:57.481866+00:00 app[web.1]: npm ERR! syscall spawn
2019-07-24T05:52:57.482878+00:00 app[web.1]: npm ERR! [email protected] start: `ng serve`
2019-07-24T05:52:57.482985+00:00 app[web.1]: npm ERR! spawn ENOENT
2019-07-24T05:52:57.483185+00:00 app[web.1]: npm ERR!
2019-07-24T05:52:57.483289+00:00 app[web.1]: npm ERR! Failed at the [email protected] start script.
2019-07-24T05:52:57.483387+00:00 app[web.1]: npm ERR! This is probably not a problem with npm. There is likely additional logging output above.
2019-07-24T05:52:57.489648+00:00 app[web.1]:
2019-07-24T05:52:57.489807+00:00 app[web.1]: npm ERR! A complete log of this run can be found in:
2019-07-24T05:52:57.489875+00:00 app[web.1]: npm ERR!     /app/.npm/_logs/2019-07-24T05_52_57_484Z-debug.log
2019-07-24T05:53:04.457510+00:00 heroku[router]: at=error code=H10 desc="App crashed" method=GET path="/" host=test-sales-inventory.herokuapp.com request_id=234286bc-3934-48e2-9315-ff79a4aa5264 fwd="192.46.82.6" dyno= connect= service= status=503 bytes= protocol=http
2019-07-24T05:53:05.913904+00:00 heroku[router]: at=error code=H10 desc="App crashed" method=GET path="/favicon.ico" host=test-sales-inventory.herokuapp.com request_id=969b41f7-3cea-4341-b75f-a69ba41393ac fwd="192.46.82.6" dyno= connect= service= status=503 bytes= protocol=http
2019-07-24T05:53:40.892802+00:00 heroku[router]: at=error code=H10 desc="App crashed" method=GET path="/" host=test-sales-inventory.herokuapp.com request_id=777a3c0c-1879-4a17-ade0-4ae56490b7e9 fwd="192.46.82.6" dyno= connect= service= status=503 bytes= protocol=http
2019-07-24T05:53:41.594862+00:00 heroku[router]: at=error code=H10 desc="App crashed" method=GET path="/favicon.ico" host=test-sales-inventory.herokuapp.com request_id=e8db9ab8-a1ce-4a3d-a3a3-8f716d2b8309 fwd="192.46.82.6" dyno= connect= service= status=503 bytes= protocol=http
2019-07-24T05:53:59.658086+00:00 app[api]: Starting process with command `heroku logs --tail` by user *************************
2019-07-24T05:54:08.647493+00:00 heroku[run.1033]: State changed from starting to up
2019-07-24T05:54:08.739914+00:00 heroku[run.1033]: State changed from up to complete
2019-07-24T05:54:08.665945+00:00 heroku[run.1033]: Awaiting client
2019-07-24T05:54:08.710594+00:00 heroku[run.1033]: Error R13 (Attach error) -> Failed to attach to process
2019-07-24T05:54:08.713926+00:00 heroku[run.1033]: Process exited with status 128

Here's a the package.json of my angular app

{
  "name": "sales-and-inventory",
  "version": "1.0.0",
  "scripts": {
    "ng": "ng",
    "start": "ng serve",
    "test": "ng test",
    "lint": "ng lint",
    "e2e": "ng e2e",
    "install:clean": "rm -rf node_modules/ && rm -rf package-lock.json && npm install && npm start",
    "heroku-postbuild": "ng build --prod"
  },
  "private": true,
  "dependencies": {
    "@angular/animation": "^4.0.0-beta.8",
    "@angular/animations": "7.2.4",
    "@angular/cdk": "^7.2.4",
    "@angular/common": "7.2.4",
    "@angular/compiler": "7.2.4",
    "@angular/core": "7.2.4",
    "@angular/forms": "7.2.4",
    "@angular/http": "7.2.4",
    "@angular/material": "^7.2.4",
    "@angular/platform-browser": "7.2.4",
    "@angular/platform-browser-dynamic": "7.2.4",
    "@angular/router": "7.2.4",
    "@ng-bootstrap/ng-bootstrap": "4.0.1",
    "@ng-select/ng-select": "^2.20.0",
    "bootstrap": "4.1.3",
    "chart.js": "2.7.3",
    "clipboard": "2.0.4",
    "core-js": "2.6.4",
    "ngx-clipboard": "11.1.9",
    "ngx-toastr": "9.1.2",
    "nouislider": "13.1.1",
    "rxjs": "6.4.0",
    "zone.js": "0.8.29",
    "typescript": "3.2.4"
  },
  "devDependencies": {
    "@angular-devkit/build-angular": "0.13.1",
    "@angular/cli": "7.3.1",
    "@angular/compiler-cli": "7.2.4",
    "@angular/language-service": "7.2.4",
    "@types/jasmine": "3.3.8",
    "@types/jasminewd2": "2.0.6",
    "@types/node": "11.9.0",
    "codelyzer": "4.5.0",
    "enhanced-resolve": "^3.3.0",
    "jasmine-core": "3.3.0",
    "jasmine-spec-reporter": "4.2.1",
    "karma": "^4.1.0",
    "karma-chrome-launcher": "2.2.0",
    "karma-coverage-istanbul-reporter": "2.0.4",
    "karma-jasmine": "2.0.1",
    "karma-jasmine-html-reporter": "1.4.0",
    "protractor": "5.4.2",
    "ts-node": "8.0.2",
    "tslint": "5.12.1",
    "typescript": "3.2.4"
  },
  "engines": {
    "node": "10.15.0",
    "npm": "6.4.1"
  }
}

I also inserted this code

app.use(express.static(__dirname + '/dist/sales-and-inventory'));

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

res.sendFile(path.join(__dirname+'/dist/sales-and-inventory>/index.html'));
});

Inside my angular folder, there's a folder called "Back" where my back end is. Here's how to get my server.js Back => App => Config => server.js

Elisha Kramer · Accepted Answer · 2019-07-26 09:47:41Z

2

The issue is with your Package.json file.

When heroku deploys a nodejs app, it automatically runs the npm start script.

In your case the npm start script is defined as ng serve. And, as the Heroku logs tells you: "ng: not found".

The answer is in this Angular CLI issue.

In it, they recommend that within your package.json file:

Move

"@angular/cli": "7.3.1",
    "@angular/compiler-cli": "7.2.4",

from the "devDependencies" to "dependencies", "as that's the missing ng error. Also, change postinstall for heroku-postbuild as it achieves the same thing, but doesn't trigger a build when you're installing deps locally"

answered Jul 26, 2019 at 9:47

Elisha Kramer

863 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Heroku deployment failed? How to deploy Angular App + NodeJs properly?

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related