Sass/Compass - Generate rule only if parameter is

2019-08-31 05:24发布

问题:

I have something like this in one of my SCSS include files:

$inputBorderRadius: 0 !default;

.input {
  @include border-radius($inputBorderRadius);
}

This works fine; I can override the $inputBorderRadius before including the above code and everything behaves the way I expect.

What I'm wondering is whether there's a way to tell SASS not to generate the border-radius rule at all if (for example) $inputBorderRadius is null. In my case, I just don't want to generate superfluous rules like border-radius: 0 that specify the default.

I am aware of the @if directive, but the documentation says:

Note that control directives are an advanced feature, and are not recommended in the course of day-to-day styling.

Am I thinking about this all wrong? I'm fairly new to SASS, so I hope this isn't too much of a n00b question.

回答1:

You just want to use the null value in place of 0. Null is available now in Sass 3.2, and doesn't output the property when it is the only value.

You can also take that warning more lightly. You don't want to get carried away with control directives in normal use, but they aren't going to hurt anything when you need them. There's a helpful if($test, $true, $false) function for the simpler cases as well.