Css 更新后的内联样式

我刚刚将我的项目升级到Angular 12，它有两种延迟加载样式：

[
   {
      "inject":false,
      "input":"src/styling/dark-style.scss",
      "bundleName":"dark-style"
   },
   {
      "inject":false,
      "input":"src/styling/light-style.scss",
      "bundleName":"light-style"
   }
]

它们都是手动添加到index.html的，可以使用Angular服务手动切换

我在angular.json中也尝试过这个，但没有成功：

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

问题是，所有这些stlyes都是在升级到12之后由编译器添加到index.html的，并且一些样式现在正在中断，因为这些额外的样式被添加到head部分：

  <style>@charset "UTF-8";:root{--blue:#007bff;--indigo:#6610f2;--purple:#6f42c1;--pink:#e83e8c;--red:#dc3545;--orange:#fd7e14;--yellow:#ffc107;--green:#28a745;--teal:#20c997;--cyan:#17a2b8;--white:#fff;--gray:#6c757d;--gray-dark...}}</style><link rel="stylesheet" href="dark-style.css" title="dark-style" media="all" onload="this.media='all'"><noscript><link rel="stylesheet" href="dark-style.css"></noscript>
  <style>@charset "UTF-8";:root{--blue:#007bff;--indigo:#6610f2;--purple:#6f42c1;--pink:#e83e8c;--red:#dc3545;--orange:#fd7e14;--yellow:#ffc107;--green:#28a745;--teal:#20c997;--cyan:#17a2b8;--white:#fff;--gray:#6c757d;--gray-dark...}}</style><link rel="stylesheet" href="light-style.css" title="light-style" media="all" onload="this.media='all'" disabled=""><noscript><link rel="stylesheet" href="light-style.css"></noscript>

@charset“UTF-8”；：根{--蓝色：#007bff；--靛蓝：#6610f2；--紫色：#6f42c1；--粉色：#e83e8c；--红色：#dc3545；--橙色：#fd7e14；--黄色：#ffc107；--绿色：#28a745；--青色：#20c997；--青色：#17a2b8；--白色：#f；--灰色：#深灰色……}
@字符集“UTF-8”；：根{--蓝色：#007bff；--靛蓝：#6610f2；--紫色：#6f42c1；--粉色：#e83e8c；--红色：#dc3545；--橙色：#fd7e14；--黄色：#ffc107；--绿色：#28a745；--青色：#20c997；--青色：#17a2b8；--白色：#f；--灰色：#深灰色……}

在Angular 12之前，这些标签不是自动添加的，有没有办法去掉它们