如何使用 mixins 设置 mdc-icon-button 的密度？

Question

我对使用 sass 很陌生，我在为 Material.io's icon buttons.
使用 mixin 时遇到了一些问题我链接的页面描述了使用 density($density-scale) mixin，但我似乎无法弄清楚如何使用它。 Getting Started 指南展示了如何为 mdc-button 使用混入的示例，因此我尝试对 mdc-icon-button 执行相同的操作。这是我尝试过的一些事情。

@use "@material/icon-button/mdc-icon-button";
@use "@material/icon-button";
// ^ The line above results in this error: SassError: Can't find stylesheet to import.

对于实际元素，由于此导入无效，我尝试了以下方法。

.mdc-icon-button {
    @include icon-button.density(-1);
    // ^ SassError: There is no module with the namespace "icon-button".
    @include mdc-icon-button.density(-1);
    @include mdc-icon-button-density(-1);
    @include density(-1);
    // ^ All of these lines cause the following error: SassError: Undefined mixin.
}

我只是不确定此时该做什么。我怎样才能为这个组件使用密度混合？

Answer 1

这实际上是 sass-loader 的错误。在解决其他问题时，您可以查看 here 的临时解决方法。使用变通方法导致导入不再失败，并且组件的文档仍然准确。

如何使用 mixins 设置 mdc-icon-button 的密度？

How do you set the density for mdc-icon-button using mixins?

sass

material-components-web