Scss 判断变量或maxin是否存在

梗概:

自检相关函数，属于内置扩展meta下的方法

1. feature-exists()检查当前scss版本是否存在某个特性
2. variable-exists()检查当前作用域中是否存在某个变量
3. mixin-exists()检查某个mixin是否存在。 返回的是个布尔值。

实例:

$color:#F00;
@mixin padding($left:0, $top:0, $right:0, $bottom:0) {
    padding: $top $right $bottom $left;
}
 
.container {
    @if variable-exists(color) {
        color: $color;
    }
    @else {
        content: "$color不存在";
    }
    @if mixin-exists(padding) {
        @include padding($left: 10px, $right: 10px);
    }
}

编译为

.container {
    color: #F00;
    padding: 0 10px 0 10px;
}