angular-cli: AOT build fails due to "JavaScript heap out of memory"
Bug Report or Feature Request (mark with an x
)
- [X ] bug report -> please search issues before submitting
- [ ] feature request
Versions.
@angular/cli: 1.0.0
node: 7.7.4
os: win32 x64
@angular/animations: 4.0.0
@angular/common: 4.0.0
@angular/compiler: 4.0.0
@angular/core: 4.0.0
@angular/flex-layout: 2.0.0-rc.1
@angular/forms: 4.0.0
@angular/http: 4.0.0
@angular/material: 2.0.0-beta.2
@angular/platform-browser: 4.0.0
@angular/platform-browser-dynamic: 4.0.0
@angular/router: 4.0.0
@angular/cli: 1.0.0
@angular/compiler-cli: 4.0.0
Repro steps.
ng build --prod --aot
The log given by the failure.
/node_modules/@angular/material/aut 92% chunk asset optimization
<--- Last few GCs --->
[6328:0000016AB4D09F00] 1775597 ms: Mark-sweep 1411.2 (1513.5) -> 1411.0 (1513.5) MB, 1240.6 / 0.0 ms last resort
<--- JS stacktrace --->
==== JS stack trace =========================================
Security context: 0000034B0DD266A1 <JS Object>
2: optimize [0000000FABC02311 <undefined>:5480] [pc=00000082575652C8](this=000000633199A279 <an AST_Call with map 0000014753FA0291>,compressor=00000226DBDECA61 <a Compressor with map 0000032B1EC8F829>)
3: before [0000000FABC02311 <undefined>:5463] [pc=0000008258C1818D](this=00000226DBDECA61 <a Compressor with map 0000032B1EC8F829>,node=000000633199A279 <an AST_Call with map 0000014753...
FATAL ERROR: CALL_AND_RETRY_LAST Allocation failed - JavaScript heap out of memory
Desired functionality.
I would like to be able the app using AOT.
Mention any other details that might be useful.
I have tried changing ng.cmd
to this:
@IF EXIST "%~dp0\node.exe" (
"%~dp0\node.exe" --max_old_space_size=8192 "%~dp0\..\@angular\cli\bin\ng" %*
) ELSE (
@SETLOCAL
@SET PATHEXT=%PATHEXT:;.JS;=;%
node --max_old_space_size=8192 "%~dp0\..\@angular\cli\bin\ng" %*
)
and ngc.cmd
to:
@IF EXIST "%~dp0\node.exe" (
"%~dp0\node.exe" --max_old_space_size=8192 "%~dp0\..\@angular\compiler-cli\src\main.js" %*
) ELSE (
@SETLOCAL
@SET PATHEXT=%PATHEXT:;.JS;=;%
node --max_old_space_size=8192 "%~dp0\..\@angular\compiler-cli\src\main.js" %*
)
I have 8GB swap file. The build fails after 20-25 minutes standing on 92% progress.
About this issue
- Original URL
- State: closed
- Created 7 years ago
- Reactions: 178
- Comments: 427 (63 by maintainers)
Links to this issue
Commits related to this issue
- fix(@ngtools/webpack): remove app decorators on AOT Based on @clydin's great work in #8456. I had to adapt it to use the StandardTransform model we use currently but the logic is his. Should address... — committed to filipesilva/angular-cli by filipesilva 7 years ago
- fix(@ngtools/webpack): remove app decorators on AOT Based on @clydin's great work in #8456. I had to adapt it to use the StandardTransform model we use currently but the logic is his. Should address... — committed to filipesilva/angular-cli by filipesilva 7 years ago
- fix(@ngtools/webpack): remove app decorators on AOT Based on @clydin's great work in #8456. I had to adapt it to use the StandardTransform model we use currently but the logic is his. Should address... — committed to angular/angular-cli by filipesilva 7 years ago
- fix(@ngtools/webpack): remove app decorators on AOT Based on @clydin's great work in #8456. I had to adapt it to use the StandardTransform model we use currently but the logic is his. Should address... — committed to angular/angular-cli by filipesilva 7 years ago
- fix(@angular/cli): update webpack, uglifyjs-webpack-plugin Partially address #5618 Fix #8571 Fix #8505 — committed to filipesilva/angular-cli by filipesilva 7 years ago
- fix(@angular/cli): update webpack, uglifyjs-webpack-plugin Partially address #5618 Fix #8571 Fix #8505 — committed to filipesilva/angular-cli by filipesilva 7 years ago
- fix(@angular/cli): update webpack, uglifyjs-webpack-plugin Partially address #5618 Fix #8571 Fix #8505 — committed to angular/angular-cli by filipesilva 7 years ago
- fix(@angular/cli): update webpack, uglifyjs-webpack-plugin Partially address #5618 Fix #8571 Fix #8505 — committed to angular/angular-cli by filipesilva 7 years ago
- fix(@ngtools/webpack): remove app decorators on AOT Based on @clydin's great work in #8456. I had to adapt it to use the StandardTransform model we use currently but the logic is his. Should address... — committed to d2clouds/speedray-cli by filipesilva 7 years ago
- fix(@angular/cli): update webpack, uglifyjs-webpack-plugin Partially address #5618 Fix #8571 Fix #8505 — committed to d2clouds/speedray-cli by filipesilva 7 years ago
- Reverting sourcemaps as it now fails on out of memory: https://github.com/angular/angular-cli/issues/5618 — committed to IsraelHikingMap/Site by HarelM 6 years ago
Still a problem on 4.2.6, macOS, even when giving 8GB to node.
This is a pretty serious problem… it’s time to fix this.
@filipesilva, @hansl, Before anything, thanks so much for this project- Angular has been great for our team. We love the framework and we love the CLI so thanks for all your hard work.
This memory issue seems like it is becoming a real problem. I’m looking for some messaging from the Angular team around expectations here, and I’d be happy to give whatever data is necessary to help move it forward.
Our team is an enterprise team with a medium-large app. We ran into this memory issue a while back, and upped the
max_old_space_size
to 1GB and then later 2GB. Each time it solved our problem for a few months. But as the app continues to grow we’ve run into it again now and we can’t do this forever. Our toolchain uses Bitbucket pipelines, which like many other CI’s maxes out available memory (3GB is our max given our other needs), so we’re beginning to run up against a wall.I’ve been taking some benchmarks with our app, it looks like you’re correct in your post above: 1.5.0, with
--build-optimizer=false
uses equivalent memory to 1.4.5.Our app has ~180 components and ~30 services across ~22 modules. I’d like to think it is constructed in a reasonably smart manner, following best practices and general clean code design. The
build --aot --build-optimizer=false --sourcemaps=false
for this project using 1.5.0 now takes about 2925 GB of memory.Two general questions for you and others, about (1) expectations and (2) short-term alleviation:
(1) Is Angular built for enterprise development? If so, this issue seems to be of the highest priority and the community deserves more frequent and clear messaging on this. If not, your users need to know this because lots of decisions across hundreds of companies ride on that.
(2) Are there any recommendations from the Angular team about ways to alleviate this issue?
Again, I’d be happy to test any theories/provide data about our large application to help get to the bottom of this, and again, thanks for all the hard work you’ve done on this.
Heya, using the repros you all provided I believe I’ve found the main problem with 1.5. It has to do with how the new pipeline moved decorator removal into Build Optimizer.
For those interested in a more detailed explanation, this is what happens:
--aot
, we use TypeScript transforms in Build Optimizer to remove Angular decorators (stuff like@Component
and@NgModule
) from both your app and libraries (they aren’t needed after AOT).ng build --aot
when using CLI1.4.9+NG4 versus CLI1.5.0+NG5.devextreme
lib case, there was almost 9megs of extra code included.There might be more factors contributing to the excessive memory usage but currently this is the approach I’m following as it’s the most promising one. I hope to have a PR with a fix soon.
Hi all,
I’ve bumped the priority on this issue and will be working on it. We didn’t consider it to be as urgent before because the solution at the time was to increase the available memory to node, which defaults to 1.7gb. So it was expected that at some point projects would need more memory than the default.
However with the release of 1.5 the memory requirements seem to have increased dramatically. Projects that didn’t have any memory problems before now do. 32gb is definitely a ridiculous amount of RAM and shouldn’t be needed.
At this point I’m not sure what caused the memory spike but have a few hypothesis. With CLI1.5 + Angular 5 we use a new pipeline that does better type checking by using a full TS program. Maybe there’s a bad cache somewhere in there, or the TS program is taking a lot of memory. Another possibility is Uglify, which we had to upgrade as well. Or it might be something in the AOT compiler itself. We also default build optimizer to true now and it’s not really optimized for neither speed nor memory.
If you’re running into this problem and have time, I’d appreciate if you could answer a couple questions:
ng build --prod
?ng build --prod --build-optimizer=false
ng build --aot
ng build --aot --build-optimizer
@mhevery @bradlygreen - apologies for pulling you into this one, but with @Tolitech’s extreme case above, the value proposition of Angular is starting to become seriously undermined.
Our codebase is growing rapidly, and our team is continuously running into these memory issues, where we even reach the limitations of our development and build machines. In all my years of web development there’s never been a case that I would run out of the capabilities of the machine, just to compile to several 300k files for my webapp/website. It seems to be a memory optimization or architectural issue that hopefully can be avoided.
We’ve already lost countless hours on these problems, and the premise that Angular is a framework that scales for large enterprise applications doesn’t hold up anymore.
I’d really appreciate if this issue could be prioritized, as I’m really starting to doubt whether our choice of Angular as a suitable framework was correct, considering that only the AOT builds are performant and small enough to ship to customers over the wire, and that we’re struggling to get those to work. Thank you.
@omeralper: This is my solution, it requires people to use git bash as terminal if on windows, but it would be easy to change if needed (just use the cmd file instead):
In my project root I have a folder called scripts and in it a file called ng.sh, which is a copy from node_modules/.bin/ng but with more allowed RAM to be used
Then in my package.json I do:
We’re updating the Webpack version used in the CLI in https://github.com/angular/angular-cli/pull/8689 to include the fix for excessive memory usage in
ModuleConcatenationPlugin
(https://github.com/webpack/webpack/pull/5997).This will be available in the next release of Angular CLI and should address most of the reports of excessive memory usage in
1.3.x
and up.I’d like to reiterate that it is expected that projects will reach the memory limit after a certain size. The bigger your project is, the more memory it will need to be built especially in
--prod
.For those cases the recommendation is that you run the CLI with an increased memory limit via a
npm
script:Then you can do
npm run ng-high-mem -- build --prod
to do a production build. Note the double dash (--
), it is used innpm
scripts to separate args.In this script the limit is increased to 8gigs. You can use a bigger number if you need.
Meanwhile we will keep on making improvements to reduce the memory footprint of the Angular CLI build system.
@changLiuUNSW I’ve opened a separate issue to track the excessive build time increase when using
--build-optimizer
: https://github.com/angular/devkit/issues/305.check this npm package out https://github.com/endel/increase-memory-limit
I’m less concerned about “how could this possibly…?” than I am about the lack of communication.
The compilation itself is doing some pretty heavy lifting right now. It’s really great actually. The entire CLI is. It bundles this thing up and serves it pretty compactly. In fact his may be a testament to just how easy Angular makes it to build large scale web apps… their size is outpacing the toolchain.
I’m just looking for the Angular team to set expectations here, that’s all:
Any answer to those questions is okay… but it’s important that those answers (and their progress) are communicated to the community in an iterative fashion. My team and many other teams need to make decisions based off those answers, and right now we feel frozen.
This is an open source project that we’re all getting for free. It’s added tremendous value already even with this issue; so some people are being awfully critical given this. At the same time, open communication is integral to the success of solid open source projects: we’re looking to the Angular team for that leadership.
@filipesilva , @hansl?
I upgraded to cli 1.6 and angular 5.1. The max memory the production build now using is around 1.3 GB. So no heap errors anymore.
Strange thing is that the process is ‘hanging’ at ‘92% chunk asset optimization’ for 7 minutes of the total of 9 minutes buildtime. What is happening there?
@Enngage You can replace this line:
with one of the following alternatives
Alternative 1: Create this npm script entry:
You can then in your console write:
Alternative 2: Run this in the console:
The label of this issue should be
priority: 1 (urgent)
rather thanpriority: 2 (required)
I’ve installed increase-memory-limit and after I run it, although it ran successfully and it changed the files in the local project folder (I checked the files), the ram usage was still somewhere 1400 mega bytes and not more.
What I did after that is. I went to the folder where npm is installed which in my case was
C:\Users\USER\AppData\Roaming\npm
and I opened ng.cmd and edited it and added --max-old-space-size=10240 in both places (in the if and else clause)
Only after I did that and tried ng build --prod it started to use more ram.
Here in the photo you can see that I’m running two command prompts. The first one is after I ran increase-memory-limit, and the second one is after I edited the ng.cmd file manually. You can see that it started to use 3000 mega bytes.
Before doing this edit, the rare times that it worked (to build the project) it took me 660s and now it did it for 295s.
I hope it will help you.
I started seeing this on my Azure DevOps Build server after upgrading to Angular 7.
Adding the following to
package.json
and then calling this from my build task fixed it."build-prod": "node --max_old_space_size=8000 ./node_modules/@angular/cli/bin/ng build --prod
This error happen with cli 1.6.2
use this command works for me
On windows @IF EXIST “%~dp0\node.exe” ( “%~dp0\node.exe” --max_old_space_size=4096 “%~dp0\node_modules@angular\cli\bin\ng” %* ) ELSE ( @SETLOCAL @SET PATHEXT=%PATHEXT:;.JS;=;% node --max_old_space_size=4096 “%~dp0\node_modules@angular\cli\bin\ng” %* )
@WandererInVoids ok, that’s a good sign. I’ll keep pressing on this line of investigation.
@Tolitech using your repo (CLI 1.4.1/ Angular 4.4.6 / TS 2.3.3) :
ng build
peaks at 2.2GB ramng build --prod
peaks at 18.5GB ramThe memory usage per progress
%
looks like this:I also tried to upgrade the repro to use CLI 1.5.2/ Angular 5.0.2 / TS 2.4.2.
ng build
peaks at 2.3GB ramng build --prod
peaks at 22.0GB ramThe memory usage per progress
%
looks like this:Note: using CLI 1.5 + Angular 5 defaults to using Build Optimizer on prod builds. I also noticed that the 92% phase took a lot longer than before like @changLiuUNSW reported, while memory usage kinda plateaued. It makes me think that
PurifyPlugin
(part of Build Optimizer) is what takes so long here.For comparison, I also tried compiling the project using
ngc
and it peaked at 3.3gb used memory. Comparing that to the 0-11% phase it looks like our compiler plugin doesn’t add a significant overhead.tsc
itself peaks 830MB used memory.The project using Angular 5 can be found at https://github.com/filipesilva/angular-cli-test-repo.
Here’s a breakdown of the project files by extension:
Looking at the peak memory usage numbers I can say a couple of things:
I’m going to follow up with the Webpack folks to see what’s actually happening in that last phase.
@Tolitech you’ve been a massive help getting to the bottom of this, I can’t thank you enough 💯
Angular 5 and angular-cli 1.5. Have problems
--aot
If folks want to complain about memory requirements, they can. If folks want to say it’s unreasonable this bug exists, they can. If folks want to encourage people to no longer use Angular, they can. The developers are already looking at this, no amount of vitriol will make that faster. In the mean time, add a swap volume, increase the stack size, and subscribe to the issue for updates – which unfortunately will likely be mostly complaints for a while.
1.6.0 seems to have fixed it for us. Our app compiled without extending the memory.
Hello @filipesilva I have tried to create a very similar model of what I use so that the tests can be performed with greater precision.
In this application there are basically 5 main pages (category, status, severity, project and issue) that are replicated 10 times within the same module. We have 50 pages per module. 10 modules totaling 500 pages were created.
For me, a page is composed of 3 components, the entry point, the grid and the form. So we have 1,500 components created.
There are several other components created and used by the application, base components that are inherited via typescript, pagination, menu, security, shared module, directives, guards, models, resolvers, among other elements.
Not all npm referenced libraries are being used in this example, but I believe the model is quite useful for testing.
In this example, my maximum memory consumption hit 23 GB. Somewhat below my actual case, because although this example has many more components, the components created in my real case are more complex.
I do not know if I exaggerated the number of elements created for the test. Although hundreds of services have been created (one for each page), all modules and page replications call the same five Api urls (category, status, severity, project and issue).
Both the API and the angular project are published and working in: Api: http://clientes.tolitech.com.br/ngTestApi Api Documentation: http://clientes.tolitech.com.br/ngTestApi/api-docs Angular: http://clientes.tolitech.com.br/ngtest/
To download the source code: http://www.codegenerator.com.br/downloads/ng-test.zip
@andremarcondesteixeira we will all do what we please. This isn’t the place to try to convince anybody to use another framework.
@filipesilva This is pretty serious and the workaround does not allways work - it seems to affect all medium/large projects. Needs solved for angular + angularcli to remain a viable technology for serious web projects.
I am experiencing a similar issue resulting in a
JavaScript heap out of memory
error when callingng e2e
in a project using:@angular/cli@1.0.1
@angular/*@4.1.0
node@6.10.2
I was able to create a cross-platform work-around by changing the
package.json
e2e
script entry to:I successfully build and serve with
node --max_old_space_size=8192 node_modules/@angular/cli/bin/ng serve --aot
but when i open my browser i got an error
ERROR Error: Uncaught (in promise): Error: Cannot find module ‘app/pages/login/login.module’. Error: Cannot find module ‘app/pages/login/login.module’
with this version Angular CLI: 1.5.2 Node: 6.10.3 @angular/.DS_Store: error @angular/cdk: 5.2.5 @angular/cli: 1.5.2 @angular-devkit/build-optimizer: 0.0.42 @angular-devkit/core: 0.8.1 @angular-devkit/schematics: 0.0.52 @ngtools/json-schema: 1.1.0 @ngtools/webpack: 1.8.2 @schematics/angular: 0.1.17 typescript: 2.4.2 webpack: 3.8.1
i am tired with changing url in modules and changing versions last 48 hours. please help me.
Regarding increasing available memory:
gulp
handles node flags already.ng
could do the same, with the help of https://www.npmjs.com/package/flagged-respawn. This module respawns the node process if v8 flags are present.Until then the workaround for both Linux & Windows machines is running
ng
asnode --max_old_space_size=4096 node_modules/@angular/cli/bin/ng build ...
I tried what @clydin said, using 1.7.0-beta.0 worked like a charm, it did cut my building time from over 30 minutes to 3 minutes. Thank you angular-cli team.
@angular/cli@1.6.0-rc.2
is now released and includes the memory fix on Webpack’s side.@radoslavpetranov I have been thinking about that (@randyaa said the same thing as you), and trying to figure out what a good approach is.
Something that springs to mind is to split up into multiple processes. But upon further scrutiny that approach doesn’t really help in the memory usage problem, since multiple process will use at least the same total memory, probably more due to inefficiencies and duplication.
The 1.5 problem highlighted how much Build Optimizer actually helps keep memory usage down by trimming imports (and thus project size). So maybe that’s an overall better approach. It does imply that a project must be able to use Build Optimizer though, and there might still be problems with it (code manipulation is tricky).
Another approach might be to took a look at the Uglify memory usage in large bundles. Maybe there room for config tuning or something. But it’s hard to say since those tools really rely on a semantic understanding of code bundles to work, so one does expect a lot of memory used on larger bundles.
Something else that I’ve been thinking about is to actually have a low memory setting, where disk/cpu/total time is traded for a smaller memory footprint. This is just a very high level idea that I haven’t explored at all. It would help on limited environments like CI, whereas for dev environments you really want the tradeoffs that give you better rebuild/speeds instead.
For really large projects you just can’t get around the fact there are more performant languages than JS and that build tools that can use them effectively (like Bazel) will offer a better experience.
after update to angular/cli@1.3.0 have the same issue.
@angular/cli: 1.3.0 node: 8.2.1 os: darwin x64 @angular/animations: 4.3.3 @angular/common: 4.3.3 @angular/compiler: 4.3.3 @angular/core: 4.3.3 @angular/forms: 4.3.3 @angular/http: 4.3.3 @angular/platform-browser: 4.3.3 @angular/platform-browser-dynamic: 4.3.3 @angular/router: 4.3.3 @angular/cli: 1.3.0 @angular/compiler-cli: 4.3.3
command: ng build -prod --build-optimizer --aot=true --progress=false --sourcemap
I have the same issue.
with a production configuration that looks like this
fails with
But setting the flag: --max_old_space_size=8192 makes it work.
Node version: v8.11.3 Npm version: 6.3.0
I’m a noob, but this solved my problem,
Instead of: ng build --prod
I wrote: ng build --env prod
and it worked…
Please inform me if this answere is not good an why so i can expand my knowledge 😃 Thanks.
@mast3rd3mon It depends on how big your project is.
This issue is still present even when upgrading CLI and TS to latest versions. Come on guys…
I ran into this issue. I was able to get a successful build with
node --max_old_space_size=8192 node_modules/.bin/ng build --prod
Hello @filipesilva I’ve done some more tests and would like to share it with you.
To be a fair test, I restarted my laptop at all times when I changed a line in the production.js file and after running ng build -prod.
In all tests, the virtual memory added was 32 GB. The laptop has 8 GB physical RAM.
In the ng.cmd file the configured command was --max_old_space_size = 32768 in all cases.
It is important to remember that in this test, the total memory allocated is not exactly the total memory required by Node.js, since it would be the total used by the computer in all of its processes.
However, there was no program or process running, and in all tests the computer was restarted.
Let’s go to the tests:
Test 1 Configuration:
Total memory allocated by the computer: 36.5 GB
Waiting time to complete: 26 min 24 secs
Test 2 Configuration:
Total memory allocated by the computer: 34 GB
Waiting time to complete: 20 min 52 secs
Test 3 Configuration:
Total memory allocated by the computer: 7.9 GB
Waiting time to complete: 10 min 03 secs
Test 4 Configuration:
Total memory allocated by the computer: 8.8 GB
Waiting time to complete: 13 min 59 secs
Node v8.9.1 Angular CLI 1.4.1
By my tests, I have to conclude that in my specific case, it is the
new webpack.optimize.ModuleConcatenationPlugin()
command line that is dramatically increasing my memory need.With this line enabled, my consumption goes from 8.8 GB to 36.5 GB as indicated by the windows task manager.
If you need more tests, just give me instructions. I work more with .NET, but with instructions I believe I can test.
Thank you.
What solved it for me was doing ng build --prod instead of ng build --aot --prod.
The --prod option already includes the --aot one, and optimises the build process and I’m not getting memory errors any more.
Hope it helps some of you guys.
Still a problem for us even after CLI upgrade to 1.3.1 and @angular upgrade to 4.3.5
tried typescript 2.5 but run into some compilation problems. we’re on 2.4.2.
edited:
On our local machines or our gitlab runner instances we can’t reproduce the problem. For some reason the build only fails on our jenkins box. The only difference I’ve been able to gather is jenkins is on a slightly older version of node/npm version:
instead of
fixed by changing our production npm build script to:
Not so much a fix as it is a brute force work-around, but it’ll at least buy time while we figure out what’s eating up all the heap space.
@aryavijay I feel like setting max_old_space_size in various places is not really a solution, but rather a workaround. This was not an issue before I upgraded the project and cli to angular 6.
@yaadm I think the
--env
only sets the environment.ts file, it doesn’t set all the other production mode settings that--prod
sets.I previously had this error on Angular 5 with --aot flag and then it went away with the updates to @angular/cli. I have now upgraded to Angular 6 and the issue is back 😕. I’m using:
ng serve myapp --prod
And it fails with:
Any ideas how to fix these? It works fine when aot is disabled.
Updating typescript version in package.json to the latest 2.4.x to 2.7.x, fixed the issue for me
adding to this line
"build-prod": "node --max_old_space_size=8192 ./node_modules/@angular/cli/bin/ng build --prod",
topackage.json
helped me.Hello @filipesilva
I don’t know exactly if this my comment might be useful, but I will report some tests that I did.
I have an angular-cli (1.4.1), angular (4.4.4), typescript (2.3.4) project. This project contains approximately 200 services and more than 700 components, distributed in at least 15 modules.
When running
ng build --prod
I noticed a few things. In this specific project, 0 to 1.9 GB of memory occurs up to the first 10% of the compilation. (I’m using the saas files from bootstrap).From the 11% up to the 89% compilation, my memory goes up to less than 3 GB.
From 90% to 92% the memory is used in 4.6 GB.
And finally at 95% the consumption goes up to the maximum limit allowed. In my case now, up to the 6 GB of RAM I’ve bound.
To make it compile, I had to configure virtual memory (swap). I have only 8 GB RAM.
I increased to 12 GB, 16 GB, until finally I was able to compile the project by setting 32 GB RAM.
Consumption of NodeJS hit 28 GB at these same 95% emitting.
Unfortunately this project is private and would not be able to make it available.
Tests requested:
ng build --build-optimizer=false
works! 1.5 GB max.ng build --aot
error!To try to help, I created a very simple project. In it, there are 10 modules created. In each module, there are 50 components created. In each component there is only one HTML with output “works!”.
There is no CSS, there is no third-party npm component. A simple project like this is consuming 1.6 GB of RAM for the AOT build.
I believe that consumption is a little high because it contains absolutely nothing in the project. If you wanted to download the repository to test, it is zipped in the link below. http://www.codegenerator.com.br/downloads/ng-heap-memory.zip
Thanks in advance for your help.
With Node 8.x and latest cli version works without any hack 😃
Just want to highlight something I said in https://github.com/angular/angular-cli/issues/6795#issuecomment-416623841 because it happlies here as well:
Increasing the memory limit is not a hack, and something you should expect to do at some point. Node processes have a default memory limit of about 1.7gigs. When a node process starts getting close to the memory limit it needs to spend more and more time doing garbage collection to free up memory, which in turn makes it run more slowly.
Bigger projects will use up more memory than smaller projects so at some point a project will hit the memory limit. I personally use a
npm
script for this:It’s hard to act on many of these reports since there is no objective reproduction that we can follow. It’s not that we don’t believe that builds can be slow. But builds can be slow for many reasons. It’s exceedingly likely that the projects that are seeing the most dramatic build times are suffering from some odd problem somewhere in the pipeline that is not a general problem, and for those we really need to reproduce it to fix it.
General performance improvements are of course always helpful, and we try to do them as much as possible. But the absolute best way of getting us to fix issues, especially hard to fix ones, is to offer concrete repros.
Does this not work for you? node --max_old_space_size=8192 ‘node_modules/@angular/cli/bin/ng’ build --prod --build-optimizer
The --max_old_space_size argument is for node, not ng
@makdeniss So these fail:
ng b -op aot -aot -sm -v
ng b -op aot -aot -v
But I resorted to:
node --max_old_space_size=4096 node_modules/@angular/cli/bin/ng b -op aot -aot -sm -v
Which worked. Interesting that setting the max_old_space_size to 4gb helped
bump.
@roymj88 Largely the performance issues have stemmed from build optimizations introduced in webpack that were incredibly expensive in terms of RAM usage for build. At least two of these issues were found and resolved in webpack itself, in part through the help of members of the angular-cli team.
So think it’s really important to state what version you’re using, as it may have been fixed for you, and roughly how large your project is. As depending on your size you will hit that wall eventually. Where the total build time and I think RAM usage does scale at least linearly with number of files.
So a quick-fix is indeed to simply increase the RAM usage even further. Alternatives to that:
@aindigo I think that’s incorrect. There are steady performance improvements both in the cli and more importantly in Webpack, which the angular-cli sometimes contribute themselves. Bazel as an alternative to Webpack will very likely become a very much more performant alternative while version 6 does seem to come with a fair share of improvements to the build speed in general.
You could argue for different prioritization, with the big drawback of delaying other improvements and features like Service Workers and schematics.
Regardless, think the team is doing an awesome job and hope to continue see improvements in version 6 and onwards.
@ZgjimDida its working for me for @angular/cli@1.6.8 after added --max-old-space-size=10240 in both places
Now it’s time to switch to Bazel/Rollup
Tried latest version of typescript and still didn’t help. Locally it builds but consumes 1.5 gigs of memory. Seems quite excessive.
this is so java 😃)
I’ve changed max_old_space_size in %AppData%\npm (Windows) and it works for me when launching ng serve with 1.0.0.
@dobrinsky the code sample I showed was an npm script. Those scripts go into the
package.json
file, under thescripts
key:When you use have that script, you can use
npm run ng-high-memory --
followed by the arguments instead ofng
inside that project. Always use the double dash before arguments, otherwise they might not be parsed correctly.If you are still on Angular 6 and using Docker:
This worked for my team’s project. We may consider using 4096 or even 2048 if that works for us.
@iyashiyas yes, so the workaround works well in your case and the “Cannot find module” error has nothing to do with this.
This issue makes us unable to upgrade
@angular-devkit/build-angular
from 0.6 to either 0.7 or 0.8.What is even worse, all mentioned workarounds (
buildOptimizer: false
,sourceMap: false
,--max_old_space_size=8192
) do not work for our project.On
"@angular-devkit/build-angular": "0.6.3"
everything works fine.@ar53n - I have circular dependencies defined in my application amongst my models, but those give a warning at compile time, since they will only give an error at run time and you actually create your models with the circular dependencies implemented (which shouldn’t be the case).
I got my AOT build working with the solution provided by @awerlang:
node --max_old_space_size=4096 node_modules/@angular/cli/bin/ng build ...
My exact build command based on my preferences:
node --max_old_space_size=4096 node_modules/@angular/cli/bin/ng b -op aot -sm -v -aot
My versions:
Angular CLI: 1.7.2
Node: 6.9.5
Angular: 5.2.7
I’m just being practical, the build uses heavily webpack, node etc. and a lot of other dependencies that may not be trivial to rewrite. The change to bazel is coming, so how many man years should be put into this old build pipeline?
As long as the memory requirement is not outrageous, I’d like to vote the effort to be put into something else, as there are a lot of things that need attention. It’s 2018, so I don’t think 4 or 8 gigs of memory is that much.
I also don’t think that many users would have noticed that the build uses 4 gigs of memory if that was the default.
That said, I’ll shut up now 😉
@pleerock about
--max-old-space-size
and--max_old_space_size
. node 8.9.3 on Windows gives me the following error while using--max-old-space-size
Is this supposed to happen or is it an issue with the way I configured it ?
If you have the time, can you try with CLI 1.7.0-beta.0?
@filipesilva Im able to do
build
using webpack3, latest angularcli and it takes 1 hour with node 8 as we discussed.Now, Im trying to build production version using
build --prod
and having a memory error on 92%:apparently, upgrading to latest cli(1.6)/angular(5.1)/typescript(2.5) solved the issue
Please bear in mind that the webpack update is not in yet. It will be in either
1.5.6
or1.6.0
.@tolitech I’d like to talk about the different factors influencing dev rebuilds in big projects but would much prefer to do it in a separate issue. It’s something that gets asked about frequently and it would be good to have discussion on it.
Can you open an issue called “Total rebuild time in medium and large projects”, share your experience (rebuild time in the console but also time until app is ready in the browser), and ping me there please?
@jayhamilton +1 https://github.com/swimlane/ngx-datatable/issues/1104#issuecomment-342528502
I don’t think increasing the node --stack_size is a good idea. All that will do is mask the real issue here. The build should not be gobbling up so much memory. There is a fundamental problem that needs to be fixed.
@swftvsn I am still not getting it. Maybe it is because I come from .NET where the c# compiler would tear through a project with comparable amounts of classes without breaking a sweat.
@Tolitech This is exactly the main point. If we need machines with 32 GB of ram to build the project, some cloud agents won’t be able to handle this/aren’t configurable to upgrade the hardware. Thus, we would need to make architectural decisions to start building segmented SPAs to keep the size of a project down, catering to compiler limitations.
@dpxxdp While I do agree that it is great that it is free and open source (thanks as well team!), I don’t feel that it is a criticism to report a major bug/functional limitation that requires a hardware upgrade as a work around. I don’t think anyone is trying to criticize the work that was done, but rather increase the priority on this issue.
@hugodes
I think it is because of https://github.com/angular/angular/issues/19058
https://github.com/endel/increase-memory-limit
This worked for me
You were perfect in your words, @bgever . I’m already thinking that Angular does not work for large applications, after all I’m now needing 28 Gb of RAM and the project could grow bigger. (This is the first day of this application).
I’m already thinking about another strategy for this type of project, maybe even change technology because I’m realizing that this problem is occurring with many people and for a long time.
I believe my customer will not accept me saying that he needs 28 Gb RAM to compile his own project. I’m very worried about this.
@bgever Apparently google is not using angular-cli/webpack themselves, so they don’t run into problems like this. I suspect this is why this problem receives so little attention from the angular developers. If this continues, the community should be publicly warned about angular being unsuitable for large projects.
I’ve also been getting the out of memory issue when running
ng serve
. It works fine for hours, but if I’ve been developing for a while (I’ve seen it anywhere from 2-5 hours) I will get the out of memory crash. When rerunning the serve command, I can go typically for another 2-5 hours. The first time I saw this was when updating to a beta version of 1.3, but I haven’t seen an improvement with the current release.@angular/cli: 1.2.3 node: 6.10.0 os: linux x64 @angular/animations: 4.3.1 @angular/common: 4.3.1 @angular/compiler: 4.3.1 @angular/core: 4.3.1 @angular/forms: 4.3.1 @angular/http: 4.3.1 @angular/platform-browser: 4.3.1 @angular/platform-browser-dynamic: 4.3.1 @angular/router: 4.3.1 @angular/cli: 1.2.3 @angular/compiler-cli: 4.3.1 @angular/language-service: 4.3.1
App with 3 modules and about 50 components, after switching @angular/cli from 1.1.x to 1.2.x
ng build -target=production
Have been affected by this issue since @angular/cli 1.0 was released But currently we are able to workaround it by running ng build --aot --sourcemaps=false --environment=prod
It’s not exactly the same as the --prod parameter but at least it works.
Work Around Fix I was able to fix the issue by changing my ng.cmd file to
@IF EXIST "%~dp0\node.exe" ( "%~dp0\node.exe" --max_old_space_size=8192 "%~dp0\node_modules\@angular\cli\bin\ng" %* ) ELSE ( @SETLOCAL @SET PATHEXT=%PATHEXT:;.JS;=;% node --max_old_space_size=8192 "%~dp0\node_modules\@angular\cli\bin\ng" %* )
I have the same problem when running “ng build -w” @angular/cli: 1.0.0 node: 7.8.0 @angular/* 4.0.2
setting --max_old_space_size=8192 works for me, but it is not really a good solution since I cannot redistribute it with the source code to my developers.
One note though, there are both a ng.cmd and an ng file (the latter one is an sh file), and if you are in windows as we are both can be used depending on if you run ng from git bash or cmd so both needs to be changed.
My solution to the problem will probably be to change the npm build command from ng build to call a copy of the ng bash file which I distribute with my code.
Or just use
export NODE_OPTIONS=--max_old_space_size=4096
which should fix it as well.@jarodsmk it should help, because you are giving in more memory. This is a workaround, but a hacky one.
@mast3rd3mon
I have 8 modules with approximately 89 components, 20 services, a number of interfaces and I believe around 52 model classes, failing with or without sourcemaps
@filipesilva I saw a new version of webpack has been release days ago which ships your performance tuning code, when will angular-cli release a new version refer to the latest version of webpack? Thank you.
Thanks for taking the time to look into this in such detail @filipesilva! Much appreciated!
I am also having the same issue. I can share my code to you @filipesilva
@tolitech FYI I opened a webpack issue for the
ModuleConcatenationPlugin
memory usage: https://github.com/webpack/webpack/issues/5992.@Tragetaschen it’s not just the HTML files, it’s all the TS and code transformations too. The amount of memory used by the plugin (which is developed in this repo) is reasonable insofar as it is not a big overhead, 3 vs 3.3gb, over the
ngc
compiler itself (which is developed in angular/angular).To add on @emilio-martinez’s answer, on Windows use:
node --max_old_space_size=8192 node_modules/@angular/cli/bin/ng build --prod
Still encountering this issue with angular cli 1.5.2
`ng build --aot --prod 95% emitting
<— Last few GCs —>
209426 ms: Mark-sweep 1512.7 (1406.8) -> 1512.5 (1406.8) MB, 453.1 / 0.0 ms [allocation failure] [GC in old space requested]. 209905 ms: Mark-sweep 1512.5 (1406.8) -> 1513.6 (1403.8) MB, 479.5 / 0.0 ms [last resort gc]. 210359 ms: Mark-sweep 1513.6 (1403.8) -> 1514.7 (1403.8) MB, 453.6 / 0.0 ms [last resort gc].
<— JS stacktrace —>
==== JS stack trace =========================================
Security context: 0x4353ac3fa99 <JS Object> 1: SparseJoinWithSeparatorJS(aka SparseJoinWithSeparatorJS) [native array.js:~75] [pc=0x1e05abc97c4a] (this=0x4353ac04241 <undefined>,w=0x1a58c504381 <JS Array[1078]>,F=0x1a58c5043a1 <JS Array[1078]>,x=1078,I=0x37d7075bc209 <JS Function ConvertToString (SharedFunctionInfo 0x4353ac5dbc9)>,J=0x4353ac4a369 <String[1]: >) 2: DoJoin(aka DoJoin) [native array.js:~129] [pc=0x1e05abb3c1b6] (thi…
FATAL ERROR: CALL_AND_RETRY_LAST Allocation failed - JavaScript heap out of memory 1: node::Abort() [/usr/local/bin/node] 2: node::FatalException(v8::Isolate*, v8::Localv8::Value, v8::Localv8::Message) [/usr/local/bin/node] 3: v8::internal::V8::FatalProcessOutOfMemory(char const*, bool) [/usr/local/bin/node] 4: v8::internal::Factory::NewRawTwoByteString(int, v8::internal::PretenureFlag) [/usr/local/bin/node] 5: v8::internal::Runtime_SparseJoinWithSeparator(int, v8::internal::Object**, v8::internal::Isolate*) [/usr/local/bin/node] 6: 0x1e0596e060c7 Abort trap: 6 Jays-MacBook-Pro:ngx-dynamic-dashboard-framework jayhamilton$ ng --version
/ \ _ __ __ _ _ | | __ _ _ __ / | | | | / △ \ | ’ \ / _
| | | | |/ _
| '| | | | | | | / ___ | | | | (| | || | | (| | | | || | | | // __| ||_, |_,||_,|| _||| |___/Angular CLI: 1.5.2 Node: 6.11.1 OS: darwin x64 Angular: 5.0.1 … animations, common, compiler, compiler-cli, core, forms … http, platform-browser, platform-browser-dynamic, router
@angular/cdk: 2.0.0-beta.12 @angular/cli: 1.5.2 @angular/material: 2.0.0-beta.12 @angular-devkit/build-optimizer: 0.0.33 @angular-devkit/core: 0.0.20 @angular-devkit/schematics: 0.0.36 @ngtools/json-schema: 1.1.0 @ngtools/webpack: 1.8.2 @schematics/angular: 0.1.5 typescript: 2.6.1 webpack: 3.8.1 `
According to changelog the above mentioned fix is included in 1.5.1+. It still fails for
ng build --prod
with 1.5.2 😦95% emitting <— Last few GCs —>
[4980:000001B75DBAB8D0] 268298 ms: Mark-sweep 1399.5 (1698.5) -> 1399.5 (1698.5) MB, 483.4 / 0.0 ms allocation failure GC in old space requested [4980:000001B75DBAB8D0] 268868 ms: Mark-sweep 1399.5 (1698.5) -> 1399.5 (1629.5) MB, 569.7 / 0.0 ms last resort GC in old space requested [4980:000001B75DBAB8D0] 269387 ms: Mark-sweep 1399.5 (1629.5) -> 1399.5 (1600.0) MB, 518.8 / 0.0 ms last resort GC in old space requested
<— JS stacktrace —>
==== JS stack trace =========================================
Security context: 00000185B7C25EC1 <JSObject> 1: DoJoin(aka DoJoin) [native array.js:~95] [pc=0000002F55357679](this=00000075A3182311 <undefined>,p=0000001FB1A5B831 <JSArray[937]>,q=937,E=00000075A31823B1 <true>,A=00000185B7C6EC69 <String[1]: >,z=00000075A3182421 <false>) 2: Join(aka Join) [native array.js:~120] [pc=0000002F550C6489](this=00000075A3182311 <undefined>,p=0000001FB1A5B831 <JSArray[937]>,q=937,A=00000185B7C6EC69 <Str…
FATAL ERROR: CALL_AND_RETRY_LAST Allocation failed - JavaScript heap out of memory
@filipesilva i used same workaround i described it in my comment https://github.com/angular/angular-cli/issues/5618#issuecomment-343224021
command
ng build --app homeapp -aot=true -e=prod -sm=false -ec=true --named-chunks=false -oh=all --build-optimizer=true -vc=true
my memory usage: 0 % -18 % <= 828 mb 18% -89 <= 1140 mb 90 - 100 < 1253 mb
difference between --build-optimizer=true and false 90 mb
for uglify used gulp-uglify^3.0.0 default settings 1058 mb also i used gulp-postcss for uglify and autoprefixer all latest version
@angular 5.0.1 @angular/cli 1.5.0
@filipesilva we all could also help debugging the webpack build, what tool are you using to debug it? I was trying like that, but I’m not sure is the best way:
node-nightly --inspect-brk ./node_modules/@angular/cli/bin/ng build --prod
If you give me more instructions here or on Gitter I will be more than happy to help.
What version of the CLI and Angular are you on?
Does this only happen on ng build --prod? NOT SURE Do you still get the memory error with these build commands:
also:
If you have a project that I can look at, can you link it please?
we have a gitter channel if you need help to build our project and have a look:
I had experienced the issue
FATAL ERROR: CALL_AND_RETRY_LAST Allocation failed - JavaScript heap out of memory
withng build --prod
. I have solved the problem by using node --max_old_space_size=8192 node_modules/@angular/cli/bin/ng build --prodYou can add also in
as
@swftvsn, memory is cheap if you have control over it, but we deploy to a Docker swarm, and containers have limited memory. This is a pretty serious issue for us. I’d prefer a slower build if that means caching stuff to disk and not running out of memory.
Hey all, I’m seeing a lot of new reports of this happening after 1.5 is out. One of the changes we did for 1.5 was to use Build Optimizer by default on Angular version 5 projects. Build optimizer does indeed use a lot of memory (https://github.com/angular/devkit/issues/240).
Can you tell me if turning off build optimizer helps with your memory crashes? You can do it with
--build-optimizer=false
. Turning off sourcemaps can also help via--sourcemaps=false
.If these options don’t help, can you post here the full failure log please, including command run?
We are experiencing the same issue… eclipsing 3GB of memory in a medium-large application. We have ~20 modules each with 5-8 components.
This command works for me: node --max-old-space-size=4096 ./node_modules/@angular/cli/bin/ng build --prod
“scripts”:{ “prod”: “node --max-old-space-size=4096 ./node_modules/@angular/cli/bin/ng build --prod” }
I don’t know if it can help someone but we had the same problem after upgrading to version 1.3.0. And we had others problem too : slow compilation and bad names for generated chunk.
All our problems were solved with this : https://github.com/angular/angular-cli/pull/7338
It’s time to fix this !!! In real big project angular is bad because of that ! Maybe webpack problem !! Thanks
I wrote a little script that lets me control the memory limit in the config section of
package.json
. https://github.com/isaacplmann/angular-cli-aliasincrease-memory-limit
looks pretty sweet too. It didn’t exist when I wrote my script and it doesn’t let you set your own memory limit.I’m getting OOM errors with
@ngtools/webpack
1.3.0 and@angular
4.0.0. This is on OSX and not Windows as well.I’m so afraid there will be no solution for this issue. I reverted to rc.2 because of this 😦
I got the same issue too.
So, I tried to build the same project (@angular 4.0.0) using ng-cli 1.0.0-rc.4 and it works fine. ng build --prod --aot
@angular/cli: 1.0.0-rc.4 node: 6.9.5 os: win32 x64 @angular/common: 4.0.0 @angular/compiler: 4.0.0 @angular/core: 4.0.0 @angular/forms: 4.0.0 @angular/http: 4.0.0 @angular/platform-browser: 4.0.0 @angular/platform-browser-dynamic: 4.0.0 @angular/router: 4.0.0 @angular/cli: 1.0.0-rc.4 @angular/compiler-cli: 4.0.0
i could run with optimizejs using
node --max-old-space-size=8192 ./node_modules/@ionic/app-scripts/bin/ionic-app-scripts.js build --release --prod --minifyjs --minifycss --optimizejs
before i face problem with java heap out of memory and i run code with increasing memory but i failed with module error… and i upgraded to angular 6 and successfully build with --prod mode
node --max_old_space_size=8192 ‘node_modules/@angular/cli/bin/ng’ build --prod
Else you can set your angular.json “build-prod”: "node --max_old_space_size=8192 ‘node_modules/@angular/cli/bin/ng’ build --prod ",
and call build-prod in u r command
now i am using --prod its more power full other than aot
I am having the same issue, but it only occurs if I have
"sourceMap": true,
inangular.json
, otherwise it builds just fine.any solution to this ? …
Have the same issue and
sudo node --max-old-space-size=4096 /usr/local/bin/ionic cordova build android --prod
didn’t help. I’m using MacOs. Any advice ?Actually I could get both of my big projects to compile with
ng build --prod --base-href ./ --aot
if I add--sm
then both build fail. This is with latest angular cli (both global and project) and latest typescript (both global and project).@Flexicon Thanks for the tip. We like to include
--sourcemaps
on our beta/test environment, but build with the--prod
flag so the bits are the same as in production environment. I agree, no need for sourcemaps in production.I think something is kind of messed up with the SASS processing which might be contributing to these issues (definitely for dev builds but I’m not 100% sure for aot).
Essentially there seems to be something weird happening with sass de-duplication. In my project I had a common sass file with a bunch of includes (bootstrap and stuff). This is liberally included across component scss files with the expectation it would be de-duplicated in the build.
However I realized my dev build was up to 150MB for the main.bundle.js and it was hammering my workstation when it built. By re-structuring the scss to only include was was necessary in each component I bought this down to like 11MB.
For the aot build it was less significant (I think most of the size was from sourcemaps) but still went from:
to
I tried to track the memory usage as well. It seemed like with the improved scss it maxd out at about 1300MB memory to do the aot build. With the old scss setup it was similar but briefly spiked up to over 2.5GB at the end of the process. So it could be that memory useage is also affected by the duplicated scss.
(I’m using cli v1.7.0-beta.0 btw. rc.0 breaks my fonts in aot).
edit: slightly more scientific readout of memory usage:
Inefficent scss includes:
More efficent scss:
Not much in it really.
also improved scss with cli v1.7.0-rc.0 instead of beta.0:
and v1.6.8:
Using
@angular/cli@1.7.0-rc.0
DID NOT fix the issue.Workaround:
"ng-high-mem": "node --max_old_space_size=8192 ./node_modules/@angular/cli/bin/ng",
as mentioned had to be used.This is something which needs to be fixed guys.
update global and local Angular Cli to 1.7.0-rc.0 work for me
update global Angular Cli
update local Angular Cli
npm install @angular/cli@1.7.0-rc.0
@filipesilva that did the trick. I tried it but I think I mistakenly tried
--max-old-space-size
instead of--max_old_space_size
. It works fine now and only takes ~4 min. And about ~8 min on CI server. Thanks.We still have this issue. We had this issue since
angular@2
when I first time used angular CLI. Then I switched to angular starter and everything worked. Now Im trying to use angular cli again on the same project (upgrade from angular 4) and now I still have same issue with angular 5.1 and cli1.6.2
.We have a really huge project and we are using angular on this project from early versions of angular since 2013.
When I simply use
ng build
build is going 1 hour. Here is a log.When I use
ng build
I always have an error (after few minutes of build):If you want to know how many code and files we have:
@elclanrs not here, (1.6.0)
@WandererInVoids, disabling build optimizer did the trick. Thank you for the advice.
@tragetaschen I think Felipe is commenting on your math. That step doesn’t just involve the HTML file but includes the typescript and CSS files too. In order to properly uglify your entire project is brought into memory, so you can’t just count the HTML. Additionally, some of your logic may cause duplication of subsets of your Dom, exploding the size. This is a complicated task that will take a good amount of RAM. We should use as little as possible, but we can’t expect miracles.
@mattem can you open an issue called “Total rebuild test time in medium and large projects”, similar to the one I asked @Tolitech to open in https://github.com/angular/angular-cli/issues/5618#issuecomment-346024634? It’s a broader topic as well.
I don’t get how 3.3 Gb memory for 1500 HTML files is reasonable. That’s 2 Mb per file. Do these numbers contain collectable garbage or is this what’s actually claimed until the end of the build?
Thank you @filipesilva for your help, I did the following:
and now the result is the following:
So, in general raise the max_old_space_size fix my issue at exception of the “ng build --prod”, in this case my problem seems to be related to this: https://github.com/angular/angular/issues/20115. In other words the problem seems to be the presence of ts files in my libraries and aot geting angry about it 😃, the solution for this point seems to be put ts file in the .npmignore and exclude it from the packages. (haven’t test it yet)
I’m just reporting the finding, hopying it helps others…all the credit goes to @filipesilva.
@filipesilva @Shadowlauch I have just recognized that the machine I tested before had node 6.x upgrading it to 8.9.1 solved the problem and ng build --prod --aot works now. Thank you for the help.
@filipesilva Using
ng build --prod
gave the OOM error, however running the CLI withnode --max_old_space_size=8192
it did complete, with the following memory usage (observed from looking at Activity Monitor in MacOS):Running with
ng build --environment=prod --aot --sourcemaps=false --base-href="/ui/" --preserve-symlinks --output-hashing=all --extract-css=true
(no increasingmax_old_space
) tops out at 1.49gb real / 6.23gb virtual. This is running with@angular/cli@1.4.7
and@angular/*@4.4.5
We use
gulp-uglify@3.0.0
, giving usuglify-js@3.0.28
, setting compress and mangle totrue
. The output is also run thoughloose-envify
,uglifycss
, andhtmlmin
The gulp task peaks at 868mb real / 5.57gb virtual.@filipesilva
I’ve just tried on a clean install and it still fails for me. I’m on OSX Sierra and am running node v7.7.3
I also note that if I run ng build --prod --build-optimizer=false it will run successfully repeatedly, whereas running just ng build --prod will fail most of the time.
I’m not sure what I can add here - is there some sort of profiling I can run on my side and provide the output?
thanks
@filipesilva
Yes, main bundle increased by roughly 4MB. Sadly the project isn’t open source, but it’s pretty complex anyway the other project is a better example to try diagnose I think.
@JonathanYates @MichalEmbiq @andremarcondesteixeira - Have you guys tried what @filipesilva suggested in #5618 (comment)? That seems to have worked for most people and it also worked for me. Seems like a sufficient work-around until the real issue is solved.
The versions I am using CLI - 1.2.0 and Angular 4.2.5 Modules: ~ 130 Components: ~ 200 Services: ~ 70
getting the build issues with below options.
ng build --prod: fail ng build --aot=true: fail ng build --aot=true --sourcemaps=false : Works most of the times and very often it is failing. ng build --prod --aot=false : works
In response to above comment: CLI 1.5.0, Angular 5.0.1
Project: Services: 9 Components: 43 Models: 28 Lines of ts: 8200 Lines of sass: 5000
Heap error happens with:
ng build --prod
: yesng build --build-optimizer=false
: nong build --aot
: nong build --aot --build-optimizer
: noTests with angular-cli 1.5
ng build --prod build-optimizer=false --sourcemaps=false (I canceled after 12 minutes running)
node --max_old_space_size=4096 node_modules/@angular/cli/bin/ng build --prod build-optimizer=false --sourcemaps=false (work after 4,2 minutes)
@zackschuster its mere existence
This worked for me, add to package.json scripts section. Watching the memory usage in task manager it got up to around 4gb usage. Seems a touch excessive!
“build2”: “node --max_old_space_size=8192 ./node_modules/@angular/cli/bin/ng build --prod --aot”
npm run build2
It happens to me when the allowJS parameter is true in tsconfig.json. Apparently, the javascript files are overloading the memory.
Same here. Running Angular CLI 1.3.2 and Angular 4.3.6. Added this based on another thread to get it to work. My app isn’t very big but CLI clocked in at 4GB to build my app.
Hello. this problem is serious.
On my computer I was limiting to 8Gb and the ng build was working fine. (with old-max-space-size)
But now I’ve got a big big project and believe me, out of memory.
I have a code generator that builds everything perfectly. but the new project has more than 200 entities. The creation of modules and lazy loading depends on the settings made by the client and their entities.
I would not want to separate in several applications because there is a lot of dependency. (200 services, 600 components)
The project runs fine with ng serve, but not with ng build. I rented a virtual machine with 28Gb ram and believe me, did the build using 27Gb of RAM. The service node occupied exactly 27Gb.
(I put the limit of 28gb)
Everything works fine with ng serve.
can anyone know to tell me if just separating into several lazy loading modules it will need less memory to compile with ng build? or it works only to separate the JS?
I can not rent a virtual machine whenever I need to run ng build. And the effort of change will be very high. So I needed to be sure of what to do.
Thanks.
Same issue, but we’ve found a more reliable workaround to increase the memory limit.
Since Node 8.x, you can set a
NODE_OPTIONS
environment variable, and pass in the--old-max-space-size
flag. We currently need 6GB.E.g. on Windows CMD:
set NODE_OPTIONS=--old-max-space-size=6411
before running the AOT build.I wonder if there is a child process that doesn’t get the arguments that are set on the node executable.
No amount of setting
max-old-space-size
helped on our project. However, as we only build AOT in prod, we have temporarily disabled sourcemaps which seemed to fix it for us on our CI server.We seem to face the error even on allocating 12GB of memory for the build. Is there any way to debug what is causing the memory leak? also, could this be solved by implementing lazy loading of modules, since this is during build time?
Commands used: 1.node --max_old_space_size=12000 ./node_modules/@angular/cli/bin/ng build --prod --aot --env=prod 2. updated the ng to accept the --max_old_space_size parameter
The build is working only with --sourcemap=false and --aot=false; but this is causing memory leaks and page load issues in the browser due to huge application size.
StackTrace:- [INFO] [INFO] <— Last few GCs —> [INFO] [INFO] [11944:0x2710b70] 898052 ms: Mark-sweep 11998.2 (13529.5) -> 11998.2 (13529.5) MB, 4991.9 / 0.0 ms allocation failure GC in old space requested [INFO] [11944:0x2710b70] 903445 ms: Mark-sweep 11998.2 (13529.5) -> 11998.1 (13434.0) MB, 5366.9 / 0.0 ms last resort [INFO] [11944:0x2710b70] 908749 ms: Mark-sweep 11998.1 (13434.0) -> 11998.1 (13378.0) MB, 5266.9 / 0.0 ms last resort [INFO] [INFO] [INFO] <— JS stacktrace —> [INFO] [INFO] ==== JS stack trace ========================================= [INFO] [INFO] Security context: 0x2b8a8b3a66a1 <JS Object> [INFO] 1: DoJoin(aka DoJoin) [native array.js:~97] [pc=0x168f8ea1398a](this=0x38d692102311 <undefined>,q=0x39d30737fbe1 <JS Array[2905]>,r=2905,F=0x38d6921023b1 <true>,B=0x38d692157ff9 <String[1]: >,A=0x38d692102421 <false>) [INFO] 2: Join(aka Join) [native array.js:~122] [pc=0x168f8e9b25e2](this=0x38d692102311 <undefined>,q=0x39d30737fbe1 <JS Array[2905]>,r=2905,B=0x38d692157ff9 <String[1]: >,A=0x… [INFO]
@sbabeal just go to RxJS 5.4.2
We also hit that issue in NativeScript when using the
@ngtools/webpack
plugin withnativescript-dev-webpack
. We use tsconfig paths for mapping our tns-core-modules. They look like that:However, the bundling fails with the mentioned error (JavaScript heap out of memory). Just like @zackschuster , as a workaround we specified each path mapping manually:
In my case, I installed typescript@2.1.6 instead of @~2.2.0 and the memory issue went away. Give it a try.
There is an issue in ~2.2.0 and @angular/language-service 4.0.0 (in my case i use it)