ng -12 upgrade, getting missing property on build for production

[daddyschmack]

ng build --configuration production --base-href /foo/

results in the following:
Browser application bundle generation complete.
ES5 Bundle generation Complete
copying assets complete
Index html generation failed.
undefined:6:6 property missing ':'

would it be possible to get a little more information on how this error can be troubleshot?

🐞 bug report

Affected Package

The issue is caused by package @angular/....

Is this a regression?

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

Description

A clear and concise description of the problem...

🔬 Minimal Reproduction

https://stackblitz.com/...

🔥 Exception or Error

🌍 Your Environment

Angular Version:

Anything else relevant?

[zarend]

Hello, we reviewed this issue and determined that it doesn't fall into the bug report or feature request category. This issue tracker is not suitable for support requests, please repost your issue on StackOverflow using tag angular.

If you are wondering why we don't resolve support issues via the issue tracker, please check out this explanation.

[daddyschmack]

Hi, my ask is that there should be a little more in the way of diagnostic information.. I have already asked the question for support or Gitter.. I mean, it's almost impossible to troubleshoot based on that information, right?
i mean, is the error referring to line 6 character 6 in the index? Does this request make a little more sense?
If it helps at all, the error does not occur on a non production build..

[petebacondarwin]

Actually this is an issue for the CLI not the framework. So I am re-opening and transferring there.

[petebacondarwin]

But you will need to provide more of a reproduction to get any help here @daddyschmack

[alan-agius4]

The error thrown by this package https://www.npmjs.com/package/css ( https://github.com/reworkcss/css/blob/b7f3cb62dcb12f569189c38cbdb756553bf0415b/lib/parse/index.js#L224)

Without the CSS output we will not be able to determine what is the root cause of the issue, ie, if it causing by broken CSS output or is it a problem in the CSS AST parser (https://www.npmjs.com/package/css).

[alan-agius4]

Thanks for reporting this issue. However, you didn't provide sufficient information for us to understand and reproduce the problem. Please check out our submission guidelines to understand why we can't act on issues that are lacking important information.

If the problem persists, please file a new issue and ensure you provide all of the required information when filling out the issue template.

[daddyschmack]

Yes, this was an issue in style sheet. The error msg was less than helpful, but looking at the console pointed the way.

…

On Tue, Apr 20, 2021, 12:24 PM Alan Agius ***@***.***> wrote: Closed #20521 <#20521>. — You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub <#20521 (comment)>, or unsubscribe <https://github.com/notifications/unsubscribe-auth/AAVAIY2DEASKHW3YIWHXXLDTJW2F7ANCNFSM4247JZ3Q> .

[lsa-shanghai]

When our project update to 12, we face the same problem.
ng serve --hmr -o; It seems everything go welll.
ng build --configuration production; The error msg is:
✖ Index html generation failed.
undefined:3:102245: property missing ':'
Please note where to find more detail, Thanks.

[kemsky]

@alan-agius4 , well, it is kind of obvious that the error message is not helpful and also is misleading. CSS parsing failed, but it states Index html generation failed, should I debug index.html or ...?

The error can be caused by any (potentially valid) CSS, in my case, it was coming from "TinyMCE": "5.8.0" package:

            "styles": [
              "node_modules/tinymce/skins/ui/oxide/skin.css",
              "node_modules/tinymce/skins/ui/oxide/content.css"
            ],

CSS is syntactically correct, there are some non-critical errors, I've corrected them and tested using The W3C CSS Validation Service, then I applied fix to node_modules version, but angular-cli still fails to build the project with 100% correct CSS styles.

https://github.com/kemsky/angular-cli-bug

[daddyschmack]

I had this problem going directly to 12 from 9, when I followed the process going from 9 to 10, 10 to 11 and 11to 12 the problem didn't occur.

…

On Thu, May 13, 2021, 5:40 AM Alexander Turtsevich ***@***.***> wrote: @alan-agius4 <https://github.com/alan-agius4> , well, it is kind of obvious that the error message is not helpful and also is misleading. CSS parsing failed, but it states Index html generation failed, should I debug index.html or ...? The error can be caused by any (potentially valid) CSS, in my case, it was coming from "TinyMCE": "5.8.0" package: "styles": [ "node_modules/tinymce/skins/ui/oxide/skin.css", "node_modules/tinymce/skins/ui/oxide/content.css" ], CSS is syntactically correct, there are some non-critical errors, I've corrected them and tested using The W3C CSS Validation Service, then I applied fix to node_modules version, but angular-cli still fails to build the project with 100% correct CSS styles. https://github.com/kemsky/angular-cli-bug — You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub <#20521 (comment)>, or unsubscribe <https://github.com/notifications/unsubscribe-auth/AAVAIY4JGR3VCU6Y3QKQDULTNOUCVANCNFSM4247JZ3Q> .