主页 / coding / 问题 / 79177723
Accepted
Dev Scott
Asked: 2024-11-11 20:52:44 +0800 CST

SASS 在编译带有动态变量的 mixin 时抛出错误

  • 772

当我尝试编译 scss 代码时出现错误。

这是混合。

@mixin border-radius($type) {
  @if $type == 'small' {
      $radius: .5rem;
  }
  @else {
     $radius: 1rem;
  }
  border-radius: $radius;

}

在这里我应用了这个混合。

.hom_d1 {
  @include border-radius('small');
}

我被困在这个错误中，不知道如何解决它。

SassError: Undefined variable.
   ╷
27 │     border-radius: $radius;

即使通过$radius定义，我还是得到了这个。

node.js

1 个回答

  1. Best Answer

    这个错误是有道理的。这是因为变量不在 mixin 作用域内。只需将其移至$radiusmixin 级别即可。

    @mixin border-radius($type) {
  $radius: 1rem; // Default value
  @if $type == 'small' {
      $radius: .5rem;
  }
  @else {
     $radius: 1rem;
  }
  border-radius: $radius;
}
    • 2

相关问题