angular-cli: Stuck @ 70% When Building for Production (70% building modules 852/852 modules 0)

Versions

Angular CLI: 6.0.0-beta.3-62d3c05
Node: 8.9.4
OS: win32 x64
Angular: 6.0.0-beta.5
... animations, common, compiler, compiler-cli, core, forms
... language-service, platform-browser, platform-browser-dynamic
... router, service-worker

@angular/cdk: 6.0.0-beta.2-64ef3a8
@angular/cli: 6.0.0-beta.3-62d3c05
@angular/flex-layout: 2.0.0-beta.12-8bdc586
@angular/material: 6.0.0-beta.2-64ef3a8
@angular-devkit/build-optimizer: 0.4.2
@angular-devkit/core: 0.4.2
@angular-devkit/schematics: 0.4.2
@ngtools/json-schema: 1.2.0
@ngtools/webpack: 6.0.0-beta.3-62d3c05
@schematics/angular: 0.4.2
@schematics/package-update: 0.4.2
typescript: 2.6.2
webpack-bundle-analyzer: 2.11.0
webpack: 4.0.0

Repro steps

After updating to the latest CLI Build, I use the following CLI command located in my package.json file.
ng build --verbose -prod -aot --namedChunks --output-hashing none --build-optimizer true --app site --extract-licenses false --service-worker true --preserve-symlinks
I use yarn build:pwa to execute. I get no error of any kind. I am using a mono-repo, although I am not sure how that could be an issue.

Observed behavior

The build begins but then hangs at 70%.

yarn run v1.3.2
$ ng build --verbose -prod -aot --namedChunks --output-hashing none --build-optimizer true --app site --extract-licenses false --service-worker true --preserve-symlinks
 10% building modules 3/3 modules 0 active(node:20064) DeprecationWarning: Tapable.plugin is deprecated. Use new API on `.hooks` instead
(node:20064) DeprecationWarning: Tapable.apply is deprecated. Call apply on the plugin directly instead                                        24778ms building modules
34ms finish module graph
4ms sealing
0ms basic dependencies optimization
86ms dependencies optimization
0ms advanced dependencies optimization
70ms after dependencies optimization
0ms optimizing
1ms basic module optimization
78ms module optimization
36ms advanced module optimization
1ms after module optimization
125ms basic chunk optimization
1ms chunk optimization
19ms advanced chunk optimization
113ms basic chunk optimization
0ms chunk optimization
1ms advanced chunk optimization
0ms after chunk optimization
3ms module and chunk tree optimization
 70% building modules 852/852 modules 0

Desired behavior

Build my app 😃

Mention any other details that might be useful (optional)

I can provide ANY bit of information that can help. Please let me know. Thanks for all your great work! Looking forward to resolving this.

Thanks.

About this issue

Original URL
State: closed
Created 6 years ago
Reactions: 9
Comments: 18 (5 by maintainers)

Links to this issue

angular - Npm start stuck at 70% affer adding "lazy" module - Stack Overflow

Most upvoted comments

We had the same problem in our project and debugged it. node --inspect-brk node_modules/@angular/cli/bin/ng build --prod --verbose See https://nodejs.org/api/debugger.html#debugger_v8_inspector_integration_for_node_js

When the process was hanging (20% building modules 89/138 modules 49 active …) we paused the debugger and analysed the stack-trace.

We found out it was hanging in typescript.js being called by the build-optimizer.ts

Inspecting the variables we could see that the file causing the problem was a library we were importing :js-md5

We just removed the library and ng build --prod was working again!

I hope it helps you to find out why your ng build --prod is hanging.

josketres on Jun 4, 2018

If using a 6.0.0 beta release and a production build appears to be stalled at 70%, please try the build with CSS extraction disabled.

ng build --prod --extract-css false

There appears to be an issue with the extract-text-webpack-plugin beta version which supports Webpack 4. We are currently investigating the cause and will continue to update the thread with any additional information.

Note there is also a performance issue at 79% due to the above referenced issue but within the Webpack ModuleConcatentationPlugin. However, while this stage may take some time for large projects it will eventually finish. This is being investigated by the Webpack team.

clydin on Feb 28, 2018

I’m having the same issue

$ ng build --app 0 --prod --aot -sm
 10% building modules 2/2 modules 0 active(node:2304) DeprecationWarning: Tapable.plugin is deprecated. Use new API on `.hooks` instead
 77% module and chunk tree optimization ExtractTextPlugin

but adding extract-css gets a bit further and then gets stuck again

$ ng build --app 0 --prod --aot -sm --extract-css false
 10% building modules 2/2 modules 0 active(node:2272) DeprecationWarning: Tapable.plugin is deprecated. Use new API on `.hooks` instead
 92% chunk asset optimization UglifyJSPlugin

dottodot on Mar 5, 2018

this works for me:

ng build --configuration=staging --buildOptimizer=false

MrDroid17 on Sep 15, 2018

Thanks @josketres ! Saved my day. In my case it was: https://www.npmjs.com/package/@turf/turf

However, we’re actively using this library. How can I fix this? It was working fine in Angular v5.

@filipesilva any suggestions?

roldengarm on Jul 26, 2018

For me, it was issue with extract-text-webpack-plugin, which has a very buggy support for webpack 4 ( https://github.com/webpack-contrib/extract-text-webpack-plugin/issues/749 ) .

Switching to mini-css-extract-plugin solved the infinitely ongoing 70% building modules 4002/4002 modules 0 error for us.

jtomaszewski on Mar 27, 2018