如何在 sass 中检查未定义的变量答案

【问题标题】：How to check undefined variable in sass如何在 sass 中检查未定义的变量
【发布时间】：2018-10-03 12:07:26
【问题描述】：

我正在尝试在本地（特定于站点）和全局（通用）sass 文件中设置颜色变量以向 AEM 中的网站添加颜色。我按照以下方法检查未定义。但他们似乎都没有工作。获取未定义的变量 $light-gray...我正在使用 gulp sass 4.0.1

@if variable-exists($light-gray) {
		color: $light-gray;
	}else{
		color: lightgray;
	}
  
  /*------------------------------------------*/
  
  if($light-gray, $light-gray, lightgray)

另一种方法是什么

【问题讨论】：

如何以及在哪里定义变量？ Is 定义在包含在此文件之前的文件中，因为否则将不会在该文件被命中时定义它。
yes... colorvar 在本地定义并在泛型之前调用。因此，最初将加载所有变量，然后通用文件将读取所有变量。但根据我的情况，这与我们如何导入 rt 无关？因为我已经检查了条件是否已定义。
- 在 colorvar.scss. 中，我定义了颜色变量 - 在 colors.scss. 中，我调用了 colorsvar.scss.，并写了条件。 colorsvar.scss 是特定于站点的（即我在一个包中有 3-4 个网站）（我有不同的 colorsvar.scss 文件（ - 取决于每个网站所需的颜色））。 - 但是文件名 (colors.scss) 读取 (colorsvar.scss) 的通用路径取决于我们正在加载的站点。这里当我加载site2时，为site1定义的颜色变量显示未定义。
听起来你的设置很复杂，调试时不好;)

标签： css sass gulp-sass node-sass

【解决方案1】：

我发现了这个问题。它给出了未定义的因为我正在定义@if variable-exists($my-variable) not @if variable-exists(my-variable) .. 因为在@if 条件中只有字符串被视为参数。并且使用@，它正在转换包括@ 在内的整个变量并获取未定义的var。

因此答案是@if variable-exists(my-variable)

我发现另一个有趣的是，我们定义的变量不应该是任何标准的颜色代码值。如果定义了任何标准颜色代码，SASS 会自动抛出错误 'param should be a string'... 'standard color code cannot be seen as srting'...

例如@gray: #ccc .，在将 gray 作为变量名传递时，SASS 会抛出一个错误，说“它正在等待字符串”。

认为这个额外的输入可能对少数人有帮助。

【讨论】：