Polymer 如何通过shadowdom将全局css应用于web组件

我正在处理一个lit元素项目，我遇到了一个问题，

reset.css

无法应用于用

shadow root

包装的web组件

我试过这种方法，我得到了以下错误

Refused to apply style from 'http://localhost:8080/style/static/reset.css' because its MIME type ('text/html') is not a supported stylesheet MIME type, and strict MIME checking is enabled.

我尝试的代码是：

<script>
  var css = new CSSStyleSheet()
  css.replace('@import url("./style/static/reset.css")')
  document.adoptedStyleSheets = [css]
</script>

var css=new CSSStyleSheet（）
css.replace（“@import url（“./style/static/reset.css”）”）
document.adoptedStyleSheets=[css]

这被放入一个html文件中

---

如何避免此错误，并将reset.css应用于web组件？

将替换导入应用于shadowroot而不是文档是否有帮助

const node = document.createElement('div')
const shadow = node.attachShadow({ mode: 'open' })
shadow.adoptedStyleSheets = [sheet]

编辑--为清晰起见添加：

上面提到了将可能包含@import语句的样式表应用到原始问题所引用的框架上，即阴影根节点（元素），但是，因为代码试图将实例化的样式表应用到文档，所以对我来说，问题变得有点模糊

您指出的错误似乎表明代码试图应用在其他文档中创建的样式表：

如果您尝试采用在不同文档中构造的CSSStyleSheet，将抛出“NotAllowedError”DomeException

---

事实上，它应该能工作。错误来自其他地方（可能是您的web服务器设置了错误的MIME类型）