Angular CLI 16+ generates config that fails to inline stylesheet from typekit/Adobe about angular-cli HOT 8 CLOSED

You can attempt to implement the modification provided in this link locally: https://github.com/angular/angular-cli/pull/27641/files. This should help reveal more information.

from angular-cli.

@CITguy, I am unable to replicate this problem. Can you please share a reproduction?

from angular-cli.

It seems our corporate VPN is at fault, somehow. I tested on another machine that's not behind our corporate VPN and it's working fine. Unfortunately, due to the lack of information in the error output, I still don't know how to figure out exactly why things are breaking.

Any ideas how I might be able to get better debugging data from the failure?

from angular-cli.

Seems the cause is unable to get local issuer certificate, which is strange given that I can load the URL for the CSS file in my browser with no cert issues.

from angular-cli.

I wonder if the plugin should fail gracefully in the event that optimization can't succeed.

In my mind, the inlining optimization should be a "best effort", so that even if the plugin can't successfully inline styles from a CSS @import it should leave the import as-authored and potentially display a warning message in the CLI output. Worst case scenario is that an import URL is incorrect or unreachable; the browser already knows how to handle this scenario without preventing the rest of the CSS from being loaded/parsed, so why not leave it as-authored?

If the webpack optimization is attempting to do the same as the esbuild plugin (inlining the file), it seems to be leave the import as-is (though without a warning message), instead of raising a critical error (i.e., it fails gracefully).

from angular-cli.

In webpack, global stylesheets don't support font inlining; it only occurs in the index file.

This case warrants more than just a warning. If the build runs in a CI environments warnings can be overlooked. Additionally, in CI/CD pipelines,a warning can result in deploying an unoptimized version of the app, negatively impacting Core Web Vitals (CWV).

from angular-cli.

Seems the cause is unable to get local issuer certificate, which is strange given that I can load the URL for the CSS file in my browser with no cert issues.

Thus usually means that the SSL certificate authority (CA) that issued the certificate is not recognized by your system.

nodejs/help#979

from angular-cli.

Yeah, the root of the problem is Node is unaware of the Zscaler cert, which causes the request to the typekit url to fail. This issue can be closed now that #27641 will provide additional info next time I encounter an error.

from angular-cli.