JavaScript heap out of memory error while creating build in angular 2

2
votes

I want to create build in angular 2, I have write ng build --prod --aot command and get following error.

  180823 ms: Mark-sweep 1338.1 (1437.6) -> 1338.1 (1437.6) MB, 1325.4 / 0.0 ms [allocation failure] [GC in old space requested].
  182147 ms: Mark-sweep 1338.1 (1437.6) -> 1338.1 (1437.6) MB, 1323.7 / 0.0 ms [allocation failure] [GC in old space requested].
  183495 ms: Mark-sweep 1338.1 (1437.6) -> 1344.6 (1418.6) MB, 1347.4 / 0.0 ms [last resort gc].
  184844 ms: Mark-sweep 1344.6 (1418.6) -> 1351.3 (1418.6) MB, 1348.6 / 0.0 ms [last resort gc].


<--- JS stacktrace --->

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

Security context: 0x5ec47cfb51 <JS Object>
    1: token(aka token) [0x5ec4704381 <undefined>:1724] [pc=0x3e2345467b26] (this=0x5ec4704381 <undefined>,type=0x5ec4704fb1 <String[4]: name>,value=0x3363e2ffb931 <String[62]: __WEBPACK_IMPORTED_MODULE_35__angular_material_button_button__>,is_comment=0x5ec4704381 <undefined>)
    2: arguments adaptor frame: 2->3
    3: read_word(aka read_word) [0x5ec4704381 <undefined>:~1957] [pc=0x3e23435a05fb]...

FATAL ERROR: CALL_AND_RETRY_LAST Allocation failed - JavaScript heap out of memory
 1: node::Abort() [@angular/cli]
 2: 0x1096a4c [@angular/cli]
 3: v8::Utils::ReportApiFailure(char const*, char const*) [@angular/cli]
 4: v8::internal::V8::FatalProcessOutOfMemory(char const*, bool) [@angular/cli]
 5: v8::internal::Factory::NewTransitionArray(int) [@angular/cli]
 6: v8::internal::TransitionArray::Insert(v8::internal::Handle<v8::internal::Map>, v8::internal::Handle<v8::internal::Name>, v8::internal::Handle<v8::internal::Map>, v8::internal::SimpleTransitionFlag) [@angular/cli]
 7: v8::internal::Map::ShareDescriptor(v8::internal::Handle<v8::internal::Map>, v8::internal::Handle<v8::internal::DescriptorArray>, v8::internal::Descriptor*) [@angular/cli]
 8: v8::internal::Map::CopyAddDescriptor(v8::internal::Handle<v8::internal::Map>, v8::internal::Descriptor*, v8::internal::TransitionFlag) [@angular/cli]
 9: v8::internal::Map::CopyWithField(v8::internal::Handle<v8::internal::Map>, v8::internal::Handle<v8::internal::Name>, v8::internal::Handle<v8::internal::FieldType>, v8::internal::PropertyAttributes, v8::internal::Representation, v8::internal::TransitionFlag) [@angular/cli]
10: v8::internal::Map::TransitionToDataProperty(v8::internal::Handle<v8::internal::Map>, v8::internal::Handle<v8::internal::Name>, v8::internal::Handle<v8::internal::Object>, v8::internal::PropertyAttributes, v8::internal::Object::StoreFromKeyed) [@angular/cli]
11: v8::internal::LookupIterator::PrepareTransitionToDataProperty(v8::internal::Handle<v8::internal::JSObject>, v8::internal::Handle<v8::internal::Object>, v8::internal::PropertyAttributes, v8::internal::Object::StoreFromKeyed) [@angular/cli]
12: v8::internal::StoreIC::LookupForWrite(v8::internal::LookupIterator*, v8::internal::Handle<v8::internal::Object>, v8::internal::Object::StoreFromKeyed) [@angular/cli]
13: v8::internal::StoreIC::UpdateCaches(v8::internal::LookupIterator*, v8::internal::Handle<v8::internal::Object>, v8::internal::Object::StoreFromKeyed) [@angular/cli]
14: v8::internal::StoreIC::Store(v8::internal::Handle<v8::internal::Object>, v8::internal::Handle<v8::internal::Name>, v8::internal::Handle<v8::internal::Object>, v8::internal::Object::StoreFromKeyed) [@angular/cli]
15: v8::internal::Runtime_StoreIC_Miss(int, v8::internal::Object**, v8::internal::Isolate*) [@angular/cli]
16: 0x3e2341a092a7
Aborted (core dumped)

I have also try following command inside my project :

node --max-old-space-size=8192 node_modules/@angular/compiler-cli/src/main.js -p tsconfig-aot.json

and get following error :

Error: ENOENT: no such file or directory, lstat 'tsconfig-aot.json' at Error (native) at Object.fs.lstatSync (fs.js:982:18) at Object.main (/root/Desktop/rc1-dev/client/node_modules/@angular/tsc-wrapped/src/main.js:20:16) at main (/root/Desktop/rc1-dev/client/node_modules/@angular/compiler-cli/src/main.js:14:16) at Object. (/root/Desktop/rc1-dev/client/node_modules/@angular/compiler-cli/src/main.js:30:5) at Module._compile (module.js:570:32) at Object.Module._extensions..js (module.js:579:10) at Module.load (module.js:487:32) at tryModuleLoad (module.js:446:12) at Function.Module._load (module.js:438:3) Compilation failed

4
node.jsangularangular-cli
What version of the CLI? And how much RAM is in the build machine? – Tyler Jennings
RC 0 , And RAM 4GB – GsMalhotra
The CLI is out of RC now, does it make a difference if you upgrade the CLI? Also, do you have a machine with more RAM you could try building on? In this thread github.com/angular/angular-cli/issues/1652 I see people mentioning running out of memory with more than 4 GB of RAM. – Tyler Jennings
I am able to run ng build , but getting error when try build with --prod or --aot – GsMalhotra

4 Answers

6
votes

Try running build script in package json by the following script:

"scripts": {
   "build-prod": "node --max_old_space_size=5048 ./node_modules/@angular/cli/bin/ng build --prod --aot --no-sourcemap"
}

then run "npm run build-prod".

2
votes

Don't use angular-cli to host your app in production!

angular-cli developers do not recommend it as you can see here!

For the development build you will only need 1 GB of memory, but the production build is very resource intensive, it may require over 2GB of RAM.

For production you should build your app in a PC with over 2GB of ram and transfer the /dist folder to your production server.

For your production server you can use any server out there.

If you want to stick with nodejs, i recommend you to use saco to host your single page web app in production.

1
votes

Use ng build --prod --aot --no-sourcemap (pretty sure --aot and --no-sourcemap is default these days) to build for production.

Gzipping has been removed from the CLI itself. Your webserver could handle the gzipping for you or you could pipe on a gulp task or similar to compress your dist folder after build.

src https://github.com/angular/angular-cli/issues/5482

0
votes

For an webpack based application in package.json > scripts increase the value max_old_space_size=5048 accordingly.

"webpack-dev-server": "node --max_old_space_size=5048 node_modules/webpack-dev-server/bin/webpack-dev-server.js",
"webpack": "node --max_old_space_size=5048 node_modules/webpack/bin/webpack.js"