检查是否在 SASS 中定义了变量

Question

正如标题所说，我正在尝试检查变量是否在 SASS 中定义。 （如果这有什么不同，我会使用指南针）

我找到了 Ruby 等价物：

defined? foo

在黑暗中试了一下，但它只是给了我错误：

defined": expected "{", was "?

我找到了一种解决方法（这显然只是在所有情况下定义变量，在这种情况下它实际上更有意义）但我真的很想知道这在未来是否可行

Answer 1

如果你正在寻找相反的，它是

@if not variable-exists(varname)

检查它是否未定义或虚假：

@if not variable-exists(varname) or not $varname

如果你只想在它未定义或为空时设置它

$varname: VALUE !default;

Answer 2

作为补充答案 - 对于某些用例，您应该查看 default 关键字。它使您可以为尚未定义的变量分配默认值。

如果变量尚未分配，您可以通过添加 !default 标志到值的末尾。这意味着，如果 变量已经被赋值，它不会被重新赋值，但是如果 它还没有值，它会被赋予一个。

例子：

在 specific-variables.scss 你有：

$brand: "My Awesome Brand";

在 default-variables.scss 你有：

$brand: company-name !default;
$brand-color: #0074BE !default;

您的项目是这样构建的：

@import "特定变量.scss"; @import "默认变量.scss"; @import "style.scss";

品牌的价值是My Awesome Brand，品牌颜色的价值是#0074BE。

Answer 3

适用于 Sass 3.3 及更高版本

从 Sass 3.3 开始，有一个 variable-exists() 函数。来自the changelog：

• 现在可以使用这些新函数来确定不同 Sass 结构的存在：
  • variable-exists($name) 检查变量是否在当前范围内解析。
  • global-variable-exists($name) 检查给定名称的全局变量是否存在。 ...

示例用法：

$some_variable: 5;
@if variable-exists(some_variable) {
    /* I get output to the CSS file */
}
@if variable-exists(nonexistent_variable) {
    /* But I don't */
}

---

对于 Sass 3.2.x 及更早版本（我的原始答案）

我今天遇到了同样的问题：尝试检查是否设置了变量，如果设置了则添加样式、使用 mixin 等。

在阅读了isset() 函数isn't going to be added to sass 之后，我找到了一个使用!default 关键字的简单解决方法：

@mixin my_mixin() {
  // Set the variable to false only if it's not already set.
  $base-color: false !default;

  // Check the guaranteed-existing variable. If it didn't exist 
  // before calling this mixin/function/whatever, this will 
  // return false.
  @if $base-color {
     color: $base-color;
  }
}

如果false 是您的变量的有效值，您可以使用：

@mixin my_mixin() {
  $base-color: null !default;

  @if $base-color != null {
     color: $base-color;
  }
}