serve command: double processing in CLI 12 > Browser application bundle generation complete.

[mlc-mlapis]

🐞 Bug report

• serve

Is this a regression?

Yes, the previous version in which this bug was not present was: CLI 11.2.13

Description

Each command ng serve or nx run myapp:serve leads to the situation that it looks like double processing:

Build at: 2021-05-15T18:26:37.746Z - Hash: ecbd21f6a2b7772c6755 - Time: 154931ms
Build at: 2021-05-15T18:27:00.757Z - Hash: cf1562cbbca533d796f4 - Time: 10838ms

It's unclear what it means. It seems that the same doesn't happen with an incremental build.

🔥 Exception or Error

✔ Browser application bundle generation complete.

Initial Chunk Files     | Names         |      Size
main.js                 | main          |  41.70 MB
vendor.js               | vendor        |   8.27 MB
polyfills.js            | polyfills     | 584.27 kB
styles.css, styles.js   | styles        | 448.95 kB
scripts.js              | scripts       |  83.67 kB
runtime.js              | runtime       |  11.83 kB

                        | Initial Total |  51.07 MB

Lazy Chunk Files ... 23 lazy-loaded modules

Build at: 2021-05-15T18:26:37.746Z - Hash: ecbd21f6a2b7772c6755 - Time: 154931ms
** Angular Live Development Server is listening on localhost:1111, open your browser on http://localhost:1111/ **
√ Compiled successfully.

✔ Browser application bundle generation complete.
29 unchanged chunks
Build at: 2021-05-15T18:27:00.757Z - Hash: cf1562cbbca533d796f4 - Time: 10838ms
√ Compiled successfully.

🌍 Your Environment

Angular CLI: 12.0.0
Node: 12.22.1
Package Manager: npm 6.14.12
OS: win32 x64

Angular: 12.0.0
... animations, cli, common, compiler, compiler-cli, core, forms
... language-service, platform-browser, platform-browser-dynamic
... router

Package                         Version
---------------------------------------------------------
@angular-devkit/architect       0.1200.0
@angular-devkit/build-angular   12.0.0
@angular-devkit/core            12.0.0
@angular-devkit/schematics      12.0.0
@angular/cdk                    11.2.12
@angular/flex-layout            11.0.0-beta.33
@angular/material               11.2.12
@schematics/angular             12.0.0
rxjs                            6.6.3
typescript                      4.2.4

[clydin]

Is this reproducible in a project that does not use nx?

[mlc-mlapis]

@clydin It's a question. I am working mainly with Nx environment, so I need to prepare a standalone project. This issue is also meant to catch experiences from others, so we will see.

[akaufmann]

This happens (for me) when HMR is enabled and ngcc had to run. The next ng serve does not trigger generation of an additional browser application bundle with runtime.js and runtime.<hash>.hot-update.js.

[alan-agius4]

@akaufmann, that is expected when NGCC runs and has been the case for a number of major versions.

[akaufmann]

Thanks @alan-agius4! This is nothing I'm worried about. The only thing that is a bit unclear is why it builds a second browser app bundle for HMR only when NGCC had run? Is this bundle stored somewhere for the next ng serve or just not displayed?

[alan-agius4]

NGCC will amend the package.json file which will cause webpack to re-trigger a partial re-compilation even though it doesn't effect the output.

[mlc-mlapis]

@alan-agius4 Your last comment was related to which one? It's not happening in 11.2.x.

[clydin]

ngcc rewrites files in the node modules directory which can trigger rebuilds. If the extra compilation is only happening when ngcc executes then this is unfortunately expected. Webpack 5, which is used within v12, has a completely rewritten file watching system so watch behavior may differ from v11. Luckily as libraries move to the new Ivy compilation mode, ngcc will be used less and less.
If the extra compilation is happening every time regardless of ngcc, then that is a potential issue.

[mlc-mlapis]

If the extra compilation is happening every time regardless of ngcc, then that is a potential issue.

Yes, it happens on each serve command, regardless ngcc.

[alan-agius4]

If the extra compilation is happening every time regardless of ngcc, then that is a potential issue.

Yes, it happens on each serve command, regardless ngcc.

Kindly provide a reproduction so that we can investigate. Thanks.

[alan-agius4]

Closing since no reproduction was provided.

Feel free to open a new issue when you have a reproduction.

[simeyla]

Sounds like the same as this issue: #20891
Only occurs on Windows, and nothing to do with nx.

Fixed, but not yet released as of 12.0.2.

[mlc-mlapis]

@simeyla Yep, it's the same problem. The great news is that it was explained and fixed. The 12.0.3 will be released probably today or tomorrow, so super.

PS: I had a problem with reproducing it using a simple project, especially in combination with Nx.

[simeyla]

@mlc-mlapis I've still been seeing this problem but just updated to CLI 12.1 and no longer seeing it.

[mlc-mlapis]

@simeyla Since version 12.0.3, I could see the irregular observations of the problem also in 12.0.4 or 12.0.5 (rarely from time to time). I can't say the same for 12.1.0 yet. But we have to wait a bit, probably.

[simeyla]

@mlc-mlapis I'm afraid I spoke too soon. It does seem to be happening a lot less, but I've just seen it again - running the build many times in succession and just saw it one time in ten. It used to happen every single build, so I'm not sure if I'm just getting lucky or if it was partially fixed. :-(

[mlc-mlapis]

@simeyla I think that there is still something on the table. Not sure what.

[simeyla]

@mlc-mlapis are you running ng serve on Windows? I tried my project on Linux and didn't see the problem once. Based on earlier comments it seems like it's only on Windows? I was wondering about trying to set up a file watcher for my folder and see if any files are being changed or generated unnecessarily that may trigger that second build. But also I find it amazing it doesn't seem to be a bigger problem for people.

[mlc-mlapis]

@simeyla Yes, it's on Windows, and it really seems that it's specific only for this platform. It's a non-blocking problem so that people can live with it. 😄

[angular-automatic-lock-bot]

This issue has been automatically locked due to inactivity.
Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

_{This action has been performed automatically by a bot.}