Ionic 4.0.0-rc.0 - JavaScript heap out of memory on build, how to increase memory in Ionic 4?

[bkarv]

Bug Report

Ionic version:
[x] 4.x

Current behavior:
When running ionic build --prod , I am getting an error:
FATAL ERROR: Ineffective mark-compacts near heap limit Allocation failed - JavaScript heap out of memory

My last successful build was with 4.0.0-beta.16.

I had the same issue with Ionic 3 and fixed it by increasing my memory using the advice given in this github link:

Ionic App Script

The issue the solution for Ionic 3 doesn't work for Ionic 4. That is adding the following to app scripts:

add this to the package.json scripts
"ionic:build": "node --max-old-space-size=8192 ./node_modules/@ionic/app-scripts/bin/ionic-app-scripts.js build"

How do you increase your memory in Ionic 4 for building? Has anyone had this issue in Ionic 4?

Note: I have no issues running Ionic Serve. This only occurs with the build.

Expected behavior:
Build successfully

Steps to reproduce:
Create a big app and run ionic ionic build --prod
Related code:

The Complete error:

`
ionic build --prod

ng run app:build:production

<--- Last few GCs --->

[83533:0x102801c00] 121660 ms: Mark-sweep 1329.4 (1443.1) -> 1326.4 (1447.6) MB, 671.1 / 0.0 ms (average mu = 0.199, current mu = 0.124) allocation failure scavenge might not succeed
[83533:0x102801c00] 122419 ms: Mark-sweep 1332.4 (1447.6) -> 1328.6 (1456.1) MB, 731.3 / 0.0 ms (average mu = 0.122, current mu = 0.037) allocation failure scavenge might not succeed

<--- JS stacktrace --->

==== JS stack trace =========================================

0: ExitFrame [pc: 0x30d70c45be3d]

Security context: 0x18fcb001e6e1
1: getOptions(aka getOptions) [0x18fc4dbfd579] [/Users/karvanj/www/ourmgmt-client/node_modules/acorn/dist/acorn.js:~402] [pc=0x30d70ed115fc](this=0x18fc4e4826f1 ,opts=0x18fc90688de1 )
2: new constructor(aka Parser) [0x18fc4dbf3219] [/Users/karvanj/www/ourmgmt-client/node_modules/acorn/dist/acorn.js:448] [byteco...

FATAL ERROR: Ineffective mark-compacts near heap limit Allocation failed - JavaScript heap out of memory
1: 0x10003ae75 node::Abort() [/usr/local/bin/node]
2: 0x10003b07f node::OnFatalError(char const*, char const*) [/usr/local/bin/node]
3: 0x1001a7ae5 v8::internal::V8::FatalProcessOutOfMemory(v8::internal::Isolate*, char const*, bool) [/usr/local/bin/node]
4: 0x100572ef2 v8::internal::Heap::FatalProcessOutOfMemory(char const*) [/usr/local/bin/node]
5: 0x1005759c5 v8::internal::Heap::CheckIneffectiveMarkCompact(unsigned long, double) [/usr/local/bin/node]
6: 0x10057186f v8::internal::Heap::PerformGarbageCollection(v8::internal::GarbageCollector, v8::GCCallbackFlags) [/usr/local/bin/node]
7: 0x10056fa44 v8::internal::Heap::CollectGarbage(v8::internal::AllocationSpace, v8::internal::GarbageCollectionReason, v8::GCCallbackFlags) [/usr/local/bin/node]
8: 0x10057c2dc v8::internal::Heap::AllocateRawWithLigthRetry(int, v8::internal::AllocationSpace, v8::internal::AllocationAlignment) [/usr/local/bin/node]
9: 0x10057c35f v8::internal::Heap::AllocateRawWithRetryOrFail(int, v8::internal::AllocationSpace, v8::internal::AllocationAlignment) [/usr/local/bin/node]
10: 0x1005617d2 v8::internal::Handlev8::internal::TransitionArray v8::internal::Factory::NewWeakFixedArrayWithMapv8::internal::TransitionArray(v8::internal::Heap::RootListIndex, int, v8::internal::PretenureFlag) [/usr/local/bin/node]
11: 0x100553ada v8::internal::Factory::NewTransitionArray(int, int) [/usr/local/bin/node]
12: 0x10086a17d v8::internal::TransitionsAccessor::Insert(v8::internal::Handlev8::internal::Name, v8::internal::Handlev8::internal::Map, v8::internal::SimpleTransitionFlag) [/usr/local/bin/node]
13: 0x100698328 v8::internal::Map::ConnectTransition(v8::internal::Handlev8::internal::Map, v8::internal::Handlev8::internal::Map, v8::internal::Handlev8::internal::Name, v8::internal::SimpleTransitionFlag) [/usr/local/bin/node]
14: 0x100687281 v8::internal::Map::CopyReplaceDescriptors(v8::internal::Handlev8::internal::Map, v8::internal::Handlev8::internal::DescriptorArray, v8::internal::Handlev8::internal::LayoutDescriptor, v8::internal::TransitionFlag, v8::internal::MaybeHandlev8::internal::Name, char const*, v8::internal::SimpleTransitionFlag) [/usr/local/bin/node]
15: 0x10068397f v8::internal::Map::CopyAddDescriptor(v8::internal::Handlev8::internal::Map, v8::internal::Descriptor*, v8::internal::TransitionFlag) [/usr/local/bin/node]
16: 0x1006836e2 v8::internal::Map::CopyWithField(v8::internal::Handlev8::internal::Map, v8::internal::Handlev8::internal::Name, v8::internal::Handlev8::internal::FieldType, v8::internal::PropertyAttributes, v8::internal::PropertyConstness, v8::internal::Representation, v8::internal::TransitionFlag) [/usr/local/bin/node]
17: 0x100699f32 v8::internal::Map::TransitionToDataProperty(v8::internal::Handlev8::internal::Map, v8::internal::Handlev8::internal::Name, v8::internal::Handlev8::internal::Object, v8::internal::PropertyAttributes, v8::internal::PropertyConstness, v8::internal::Object::StoreFromKeyed) [/usr/local/bin/node]
18: 0x100664b38 v8::internal::LookupIterator::PrepareTransitionToDataProperty(v8::internal::Handlev8::internal::JSReceiver, v8::internal::Handlev8::internal::Object, v8::internal::PropertyAttributes, v8::internal::Object::StoreFromKeyed) [/usr/local/bin/node]
19: 0x10068a394 v8::internal::Object::AddDataProperty(v8::internal::LookupIterator*, v8::internal::Handlev8::internal::Object, v8::internal::PropertyAttributes, v8::internal::ShouldThrow, v8::internal::Object::StoreFromKeyed) [/usr/local/bin/node]
20: 0x1007f1459 v8::internal::Runtime::SetObjectProperty(v8::internal::Isolate*, v8::internal::Handlev8::internal::Object, v8::internal::Handlev8::internal::Object, v8::internal::Handlev8::internal::Object, v8::internal::LanguageMode) [/usr/local/bin/node]
21: 0x1007f4ca3 v8::internal::Runtime_SetProperty(int, v8::internal::Object**, v8::internal::Isolate*) [/usr/local/bin/node]
22: 0x30d70c45be3d
23: 0x30d70ed115fc
24: 0x30d70c4118d5
[ERROR] Signal exit from subprocess.
`

My package.json

{
  "name": "myapp",
  "version": "0.0.1",
  "author": "Ionic Framework",
  "homepage": "http://ionicframework.com/",
  "scripts": {
    "ng": "ng",
    "start": "ng serve",
    "build": "ng build",
    "test": "ng test",
    "lint": "ng lint",
    "e2e": "ng e2e"
  },
  "private": true,
  "dependencies": {
    "@angular/animations": "^7.0.4",
    "@angular/cdk": "^7.0.4",
    "@angular/common": "7.1.3",
    "@angular/core": "7.1.3",
    "@angular/forms": "7.1.3",
    "@angular/http": "7.1.3",
    "@angular/material": "^7.0.4",
    "@angular/platform-browser": "7.1.3",
    "@angular/platform-browser-dynamic": "7.1.3",
    "@angular/router": "7.1.3",
    "@auth0/angular-jwt": "^2.0.0",
    "@ionic-native/camera": "^5.0.0-beta.22",
    "@ionic-native/core": "^5.0.0-beta.22",
    "@ionic-native/file": "^5.0.0-beta.22",
    "@ionic-native/file-transfer": "^5.0.0-beta.22",
    "@ionic-native/in-app-browser": "^5.0.0-beta.22",
    "@ionic-native/keyboard": "^5.0.0-beta.22",
    "@ionic-native/splash-screen": "^5.0.0-beta.22",
    "@ionic-native/sqlite": "^5.0.0-beta.22",
    "@ionic-native/status-bar": "^5.0.0-beta.22",
    "@ionic/angular": "^4.0.0-rc.0",
    "@ionic/storage": "^2.2.0",
    "@types/lodash": "^4.14.116",
    "@types/mime-types": "^2.1.0",
    "@types/zxcvbn": "^4.4.0",
    "angular-password-strength-meter": "0.0.4",
    "cordova-browser": "5.0.4",
    "cordova-plugin-camera": "^4.0.3",
    "cordova-plugin-device": "^2.0.2",
    "cordova-plugin-file": "^6.0.1",
    "cordova-plugin-file-transfer": "^1.7.1",
    "cordova-plugin-inappbrowser": "^3.0.0",
    "cordova-plugin-ionic-keyboard": "^2.1.3",
    "cordova-plugin-ionic-webview": "^2.2.0",
    "cordova-plugin-splashscreen": "^5.0.2",
    "cordova-plugin-statusbar": "^2.4.2",
    "cordova-plugin-whitelist": "^1.3.3",
    "cordova-sqlite-storage": "^2.6.0",
    "core-js": "^2.5.3",
    "mime": "^2.3.1",
    "mobile-drag-drop": "^2.3.0-rc.1",
    "ngx-autosize": "^1.2.0",
    "ngx-drag-drop": "^1.1.0",
    "ngx-filesaver": "^2.1.1",
    "ngx-order-pipe": "^2.0.1",
    "ngx-quill-editor": "^2.2.2",
    "rxjs": "6.3.3",
    "rxjs-compat": "6.3.3",
    "zone.js": "^0.8.26",
    "zxcvbn": "^4.4.2"
  },
  "devDependencies": {
    "@angular-devkit/architect": "~0.10.5",
    "@angular-devkit/build-angular": "~0.10.5",
    "@angular-devkit/core": "7.1.2",
    "@angular-devkit/schematics": "7.1.2",
    "@angular/cli": "7.1.3",
    "@angular/compiler": "7.1.3",
    "@angular/compiler-cli": "7.1.3",
    "@angular/language-service": "7.1.3",
    "@ionic/angular-toolkit": "^1.2.0",
    "@types/file-saver": "~1.3.0",
    "@types/jasmine": "~2.8.6",
    "@types/jasminewd2": "~2.0.3",
    "@types/node": "~10.9.2",
    "angular2-uuid": "^1.1.1",
    "aws-sdk": "^2.379.0",
    "blueimp-canvas-to-blob": "^3.14.0",
    "codelyzer": "~4.5.0",
    "dom-to-image": "^2.6.0",
    "expr-eval": "^1.2.1",
    "file-saver": "^1.3.8",
    "ionic-angular": "^3.9.2",
    "ionic-plugin-keyboard": "~2.2.1",
    "ionicons": "4.5.1",
    "jasmine-core": "~2.99.1",
    "jasmine-spec-reporter": "~4.2.1",
    "karma": "~3.0.0",
    "karma-chrome-launcher": "~2.2.0",
    "karma-coverage-istanbul-reporter": "~2.0.0",
    "karma-jasmine": "~1.1.1",
    "karma-jasmine-html-reporter": "^0.2.2",
    "lodash": "^4.17.11",
    "mime-types": "^2.1.18",
    "moment": "^2.22.1",
    "ng-elastic": "^1.0.0-beta.5",
    "ng2-img-max": "^2.1.18",
    "protractor": "~5.4.0",
    "ts-node": "~7.0.0",
    "tslint": "~5.11.0",
    "typescript": "~3.1.6",
    "uuid": "^3.2.1",
    "xlsx": "^0.13.0"
  },
  "description": "An Ionic project",
  "cordova": {
    "plugins": {
      "cordova-sqlite-storage": {},
      "cordova-plugin-file": {},
      "cordova-plugin-file-transfer": {},
      "cordova-plugin-camera": {},
      "cordova-plugin-inappbrowser": {},
      "cordova-plugin-whitelist": {},
      "cordova-plugin-statusbar": {},
      "cordova-plugin-device": {},
      "cordova-plugin-splashscreen": {},
      "cordova-plugin-ionic-webview": {},
      "cordova-plugin-ionic-keyboard": {}
    },
    "platforms": [
      "browser"
    ]
  }
}

Ionic info:

Ionic:

   ionic (Ionic CLI)             : 4.5.0 (/usr/local/lib/node_modules/ionic)
   Ionic Framework               : @ionic/angular 4.0.0-rc.0
   @angular-devkit/build-angular : 0.10.6
   @angular-devkit/schematics    : 7.1.2
   @angular/cli                  : 7.1.3
   @ionic/angular-toolkit        : 1.2.0

Cordova:

   cordova (Cordova CLI) : 8.0.0
   Cordova Platforms     : none
   Cordova Plugins       : no whitelisted plugins (0 plugins total)

System:

   NodeJS : v10.13.0 (/usr/local/bin/node)
   npm    : 6.5.0
   OS     : macOS Mojave

[paulstelzer]

Thanks for your issue! Please create and share a repo where we can test it!

[bkarv]

Thanks but it’s not possible unfortunately it’s a large multi component app and commercially sensitive. What I need to know is how I can increase the build memory similar to ionic 3 which will help me a great deal to furthe debug. Also I’ve tried adding —verbose for debugging as well but nothing prints

[paulstelzer]

Just look how it's working for Angular because Ionic just use the Angular CLI

[paulstelzer]

As you can see the building process is ng run app:build:production.

I close this issue because it's not related to Ionic, more to Angular. And you cannot show us a repo, so we cannot check it if it's related to Ionic (but I don't think so)

[bkarv]

No worries and thanks for the tip. I search the issue in angular 7 cli. Although not Ionic related it would be something many users will have once Ionic 4 project gets big, so here is the solution for OS.

In terminal console:

export NODE_OPTIONS=--max_old_space_size=8096

If using windows:

set NODE_OPTIONS=--max_old_space_size=8096

Prior to running ionic build --prod

[ionitron-bot]

Thanks for the issue! This issue is being locked to prevent comments that are not relevant to the original issue. If this is still an issue with the latest version of Ionic, please create a new issue and ensure the template is fully filled out.