"Sealing" phase is stuck on #24771

Activity

1. alan-agius4 commented on Feb 23, 2023

   

   alan-agius4

   on Feb 23, 2023

   Collaborator

   More actions

   You could generate a CPU profile.

   See: https://github.com/angular/angular-cli/blob/main/docs/DEVELOPER.md#cpu-profiling
2. alan-agius4

   added

   needs: more infoReporter must clarify the issueReporter must clarify the issue

   on Feb 23, 2023
3. alexandis commented on Feb 23, 2023

   

   alexandis

   on Feb 23, 2023

   Last edited by alexandis

   Author

   More actions

   UPDATE: after about 1.5 hour (!) of just stucking, it finally gave me the error:

   
4. alexandis commented on Feb 23, 2023

   

   alexandis

   on Feb 23, 2023

   Last edited by alexandis

   Author

   More actions

   Moving on. It does not look like CPU is working at all during "sealing":

   

   
5. alexandis commented on Feb 23, 2023

   

   alexandis

   on Feb 23, 2023

   Last edited by alexandis

   Author

   More actions

   I've tried to debug "ng serve" and here's what is happening while "stuck" on "sealing" phase. I pressed "Pause" in debugger and there are numerous parsing errors inside this method which seem to silently "swallowed":

   

   1. If it it something of this sort - i.e. I need to include all such CSS into angular.json "styles" or "assets" section - i've tried it, but still getting the same error; 2) I suppose the sealing phase shouldn't stuck for 1.5 hour and the error message should be given to a user immediately. Or am I missing something?

   Everything worked "as is" before upgrade.
6. alan-agius4 commented on Feb 24, 2023

   

   alan-agius4

   on Feb 24, 2023

   Collaborator

   More actions

   @alexandis, would please provide one of these error message in a gist?
7. alexandis commented on Feb 24, 2023

   

   alexandis

   on Feb 24, 2023

   Author

   More actions

   @alexandis, would please provide one of these error message in a gist?
   Sure. Gist. Here are also configurations which might come handy.
8. alan-agius4

   added a commit that references this issue on Feb 24, 2023

   fix(@angular-devkit/build-angular): limit error message length to are…

   ...

   This issue will close once commit 3fbe37e is merged into the 'main' branch.

   3fbe37e
9. alan-agius4 commented on Feb 24, 2023

   

   alan-agius4

   on Feb 24, 2023

   Last edited by alan-agius4

   Collaborator

   More actions

   Thanks @alexandis, I did manage to get to the bottom of why the build is getting stuck and I have a PR to fix it. For the time being as a workaround you can run build/serve with the --verbose command line argument.

   Now, to the error itself, I don't know what's the root problem as I don't have context of how this stylesheet is being used in the application. How is this CSS being used? Are you importing the CSS file in your JS? In that case, you are problem encountered one of the breaking changes in version 14.

   We now issue a build time error since importing a CSS file as an ECMA module is non standard Webpack specific feature, which is not supported by the Angular CLI. This feature was never truly supported by the Angular CLI, but has as such for visibility.

   See https://github.com/angular/angular-cli/releases/tag/14.0.0 for the full list of breaking changes in v14.

   ---

   By the way, well done into getting to the bottom of why the build is stuck.

   👍React with 👍1Reacted by alexandis
10. alan-agius4

    added

    type: bug/fix

    freq1: lowOnly reported by a handful of users who observe it rarelyOnly reported by a handful of users who observe it rarely

    severity3: broken

    area: @angular-devkit/build-angular

    and removed

    needs: more infoReporter must clarify the issueReporter must clarify the issue

    on Feb 24, 2023
11. alan-agius4

    self-assigned this

    on Feb 24, 2023
12. alexandis commented on Feb 24, 2023

    

    alexandis

    on Feb 24, 2023

    Last edited by alexandis

    Author

    More actions

    @alan-agius4 thank you too for quick response. As to the css issue itself, please give me some more time. Now we are trying to recompile and merge the project having this css (seems like it is supposed to be not a simple npm update, but a real merge), it is a UI theme project based on a 3rd party project and there were a lot of changes while upgrading from Angular 13 to Angular 15 made by the 3rd party team. Besides, this project itself consumes another project, based on Angular 13 - that one cannot be changed. Once we will get a merged version, I will try another build and let's see...

    👍React with 👍1Reacted by Alan Agius
13. alan-agius4

    added 3 commits that reference this issue on Feb 24, 2023

    fix(@angular-devkit/build-angular): limit error message length to are…

    ...

    This issue will close once commit a082d54 is merged into the 'main' branch.

    a082d54

    fix(@angular-devkit/build-angular): improve parsing or error messages

    ...

    This issue will close once commit 4c402f7 is merged into the 'main' branch.

    4c402f7

    fix(@angular-devkit/build-angular): improve parsing of error messages

    ...

    This issue will close once commit e11e7f0 is merged into the 'main' branch.

    e11e7f0
14. angular-robot

    closed this as completedin #24776on Feb 24, 2023
15. angular-robot

    added 2 commits that reference this issue on Feb 24, 2023

    fix(@angular-devkit/build-angular): improve parsing of error messages

    ...

    This issue will close once commit d4c4508 is merged into the 'main' branch.

    d4c4508

    fix(@angular-devkit/build-angular): improve parsing of error messages

    ...

    This issue will close once commit 9a5609a is merged into the 'main' branch.

    9a5609a
16. alexandis commented on Feb 25, 2023

    

    alexandis

    on Feb 25, 2023

    Last edited by alexandis

    Author

    More actions

    Bot closed this bug very soon... :)

    Now, to the error itself, I don't know what's the root problem as I don't have context of how this stylesheet is being used in the application. How is this CSS being used? Are you importing the CSS file in your JS? In that case, you are problem encountered one of the breaking changes in version 14.

    I found out the initial reason of the error (there were css-importing scripts in "Dist" folder - next to CSS files, I removed them). But I still cannot figure out what is happenind next preventing the successful compilation. Could you please give me a hint how to fix this? I'm not into CSS at all, I just had to make it running fixing Angular bugs. Note: the referencing library (ours) is based on Angular 15. The library which contains the .css on the screenshot is a 3rd party library and is based on Angular 13.

    
17. alan-agius4 commented on Feb 25, 2023

    

    alan-agius4

    on Feb 25, 2023

    Collaborator

    More actions

    That is expected and is due to MDC changes in material version 15. Angular material 13 mixins are not compatible with version 15.

    See: https://material.angular.io/guide/mdc-migration

    👍React with 👍1Reacted by alexandis
18. alexandis commented on Feb 25, 2023

    

    alexandis

    on Feb 25, 2023

    Author

    More actions

    Thank you very much for the assitance!
19. angular-automatic-lock-bot commented on Mar 28, 2023

    

    angular-automatic-lock-botBot

    on Mar 28, 2023

    More actions

    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.}
20. angular-automatic-lock-bot

    locked and limited conversation to collaborators on Mar 28, 2023