使用 SCSS 时如何防止 Angular@12 在 <link>-tag 上呈现“onload”属性

Question

在 Angular@12 中使用 SCSS 时，-tag 有一个属性 onload：

<link rel="stylesheet" href="styles.672c1ac3d6da8cc311a2.css" media="print" onload="this.media='all'"><noscript><link rel="stylesheet" href="styles.672c1ac3d6da8cc311a2.css"></noscript>

但是，当 SCSS 为空或未使用 SCSS 时，它只会呈现：

<link rel="stylesheet" href="styles.31d6cfe0d16ae931b73c.css">

当使用只允许 'self' 的 CSP-Headers 时：

default-src https://*.mysite.nl ; child-src 'self' ; connect-src 'self' ; font-src 'self' ; frame-src 'self' ; frame-ancestors 'self' ; img-src 'self' ; script-src 'self' ; style-src 'self' ;

这会导致违反 CSP-Header。现在我需要将'unsafe-inline' 添加到script-src。我不想这样！

是否可以强制生产版本不使用onload？

Answer 1

找到了！

将"inlineCritical": false 添加到angular.json 解决了我的问题。

        "configurations": {
            "production": {

              "optimization": {
                "styles": {
                  "inlineCritical": false
                }
              }
            },
          },