从 SCSS 在 CSS 模块中组合全局类

Question

在 SCSS 中编写时，如何从 CSS 模块中的全局类进行编写？

根据（我的理解）CSS 模块的由全局类名组成文档，以下内容应该有效：

:global {
  .bar {
    color: purple;
  }
}

.my-icon {
  composes: bar from global;
}

但是我收到以下错误：

referenced class name "bar" in composes not found

如何更改上述内容以正确地从全局类中组合？

Answer 1

你可以这样做：

:global(.bar) {
  color: red;
}

.myIcon {
  composes: bar from global;
}

这是我使用工作示例

创建的沙箱的链接