Angular crashed while deploying to heroku

Question

this error I got from heroku logs

2022-10-07T08:35:34.000000+00:00 app[api]: Build succeeded
2022-10-07T08:35:40.754670+00:00 heroku[web.1]: Starting process with command `npm start`
2022-10-07T08:35:42.547115+00:00 app[web.1]:
2022-10-07T08:35:42.547125+00:00 app[web.1]: > [email protected] start
2022-10-07T08:35:42.547126+00:00 app[web.1]: > ng serve
2022-10-07T08:35:42.547126+00:00 app[web.1]:
2022-10-07T08:35:45.432058+00:00 app[web.1]: - Generating browser application bundles (phase: setup)...
2022-10-07T08:35:55.858437+00:00 heroku[web.1]: Process exited with status 134
2022-10-07T08:35:56.013095+00:00 heroku[web.1]: State changed from starting to crashed
2022-10-07T08:35:55.581897+00:00 app[web.1]:
2022-10-07T08:35:55.581932+00:00 app[web.1]: <--- Last few GCs --->
2022-10-07T08:35:55.581934+00:00 app[web.1]:
2022-10-07T08:35:55.581935+00:00 app[web.1]: [22:0x5182ba0]    12759 ms: Mark-sweep (reduce) 251.6 (258.4) -> 251.1 (258.4) MB, 197.5 / 0.0 ms  (average mu = 0.391, current mu = 0.244) allocation failure scavenge might not succeed
2022-10-07T08:35:55.581936+00:00 app[web.1]: [22:0x5182ba0]    12978 ms: Mark-sweep (reduce) 252.3 (258.4) -> 251.9 (259.1) MB, 211.3 / 0.1 ms  (average mu = 0.228, current mu = 0.035) allocation failure scavenge might not succeed
2022-10-07T08:35:55.581936+00:00 app[web.1]:
2022-10-07T08:35:55.581942+00:00 app[web.1]:
2022-10-07T08:35:55.581943+00:00 app[web.1]: <--- JS stacktrace --->
2022-10-07T08:35:55.581943+00:00 app[web.1]:
2022-10-07T08:35:55.581944+00:00 app[web.1]: FATAL ERROR: Reached heap limit Allocation failed - JavaScript heap out of memory
2022-10-07T08:35:55.584029+00:00 app[web.1]: 1: 0xb02960 node::Abort() [ng serve]
2022-10-07T08:35:55.584532+00:00 app[web.1]: 2: 0xa18149 node::FatalError(char const*, char const*) [ng serve]
2022-10-07T08:35:55.585229+00:00 app[web.1]: 3: 0xcdd22e v8::Utils::ReportOOMFailure(v8::internal::Isolate*, char const*, bool) [ng serve]
2022-10-07T08:35:55.585916+00:00 app[web.1]: 4: 0xcdd5a7 v8::internal::V8::FatalProcessOutOfMemory(v8::internal::Isolate*, char const*, bool) [ng serve]
2022-10-07T08:35:55.586590+00:00 app[web.1]: 5: 0xe94c15  [ng serve]
2022-10-07T08:35:55.587284+00:00 app[web.1]: 6: 0xea48dd v8::internal::Heap::CollectGarbage(v8::internal::AllocationSpace, v8::internal::GarbageCollectionReason, v8::GCCallbackFlags) [ng serve]
2022-10-07T08:35:55.588243+00:00 app[web.1]: 7: 0xea75de v8::internal::Heap::AllocateRawWithRetryOrFailSlowPath(int, v8::internal::AllocationType, v8::internal::AllocationOrigin, v8::internal::AllocationAlignment) [ng serve]
2022-10-07T08:35:55.588955+00:00 app[web.1]: 8: 0xe68b1a v8::internal::Factory::NewFillerObject(int, bool, v8::internal::AllocationType, v8::internal::AllocationOrigin) [ng serve]
2022-10-07T08:35:55.589707+00:00 app[web.1]: 9: 0x11e1886 v8::internal::Runtime_AllocateInYoungGeneration(int, unsigned long*, v8::internal::Isolate*) [ng serve]
2022-10-07T08:35:55.590500+00:00 app[web.1]: 10: 0x15d54f9  [ng serve]
2022-10-07T08:35:55.618390+00:00 app[web.1]: Aborted

and this is my package json file

{
  "name": "client",
  "version": "0.0.0",
  "scripts": {
    "ng": "ng",
    "start": "ng serve",
    "watch": "ng build --watch --configuration development",
    "test": "ng test",
    "heroku-postbuild": "ng build --prod"
  },
  "private": true,
  "dependencies": {
    "@angular-devkit/build-angular": "^13.3.9",
    "@angular/animations": "~13.0.0",
    "@angular/cdk": "^13.3.9",
    "@angular/cli": "~13.0.3",
    "@angular/common": "~13.0.0",
    "@angular/compiler": "~13.0.0",
    "@angular/compiler-cli": "~13.0.0",
    "@angular/core": "~13.0.0",
    "@angular/forms": "~13.0.0",
    "@angular/material": "^13.3.9",
    "@angular/platform-browser": "~13.0.0",
    "@angular/platform-browser-dynamic": "~13.0.0",
    "@angular/router": "~13.0.0",
    "bootstrap": "^5.2.2",
    "rxjs": "~7.4.0",
    "tslib": "^2.3.0",
    "typescript": "~4.4.3",
    "zone.js": "~0.11.4"
  },
  "devDependencies": {
    "@types/jasmine": "~3.10.0",
    "@types/node": "^12.11.1",
    "jasmine-core": "~3.10.0",
    "karma": "~6.3.0",
    "karma-chrome-launcher": "~3.1.0",
    "karma-coverage": "~2.0.3",
    "karma-jasmine": "~4.0.0",
    "karma-jasmine-html-reporter": "~1.7.0"
  }
}

What can I fix that this simple angular app run on heroku

mbojko · Accepted Answer · 2022-10-07 09:21:36Z

1

ng serve - that's for local development, not deploy. Run ng build instead and serve the artifacts from dist. You can build a rudimentary express server for that, sth along these lines:

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

app.use(express.static(path.join(__dirname, 'dist')));

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

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

answered Oct 7, 2022 at 9:21

mbojko

14.8k2 gold badges21 silver badges28 bronze badges

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

1 Comment

24sharon Over a year ago

I change from ng s to express and this is worked for me, I change the package.json to "start": "node server.js", "build": "ng build",

halfer · Accepted Answer · 2022-10-11 18:50:40Z

0

You are getting

FATAL ERROR: Reached heap limit Allocation failed - JavaScript heap out of memory

you can set a bigger space size(depending upon your free ram size 2000/3000/4000/8000) on your package.json like this in your package.json:

"scripts": {
   ...
   "start": "node --max_old_space_size=8048 ./node_modules/@angular/cli/bin/ng serve",
   ...
}

2 Comments

24sharon Over a year ago

after changing that I got Process running mem=983M(191.3%) : Error R14 (Memory quota exceeded) : Process running mem=652M(127.5%) : Error R14 (Memory quota exceeded) ]: Error R10 (Boot timeout) -> Web process failed to bind to $PORT within 60 seconds of launch : Stopping process with SIGKILL : Process exited with status 137 State changed from starting to crashed

Storytellerr Over a year ago

@24sharon please change "--max_old_space_size=8048" to --"max_old_space_size=2048"

Collectives™ on Stack Overflow

Angular crashed while deploying to heroku

2 Answers 2

1 Comment

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

1 Comment

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related