SASS 是一种 CSS 预处理器，可以让前端开发更简便和高效。它扩展了 CSS 的语法，并提供了许多强大的功能。然而，当我们在使用 SASS 的时候，有时会遇到一些编译错误。其中，期望了一个颜色，但收到了一个字符串，是一种常见的错误。
错误原因
首先，我们需要了解 SASS 中的颜色。在 SASS 中，颜色可以表示为 RGB、HSL、HEX 等形式。例如，下面两种写法都是表示颜色为蓝色：
$blue: rgb(0, 0, 255); $blue: #0000ff;
但是，如果我们将字符串当作颜色来使用，编译时就会出现期望了一个颜色，但收到了一个字符串的错误。
$blue: "blue"; background-color: $blue;
在上面的例子中，我们将字符串 "blue" 赋值给变量 $blue，然后将 $blue 作为背景颜色。这时，编译器会认为 $blue 是一个字符串，而不是一个颜色。因此，就会出现上述错误。
解决办法
解决这个问题的方法很简单：将字符串转换为颜色。
$blue: "blue"; background-color: to-color($blue);
在上面的例子中，我们使用了 to-color() 函数将字符串转换为颜色。通过这个函数，我们可以将包含颜色的字符串转换为 RGB、HSL 或者 HEX 格式的颜色。
总结
在使用 SASS 的时候，难免会遇到一些编译错误。其中，期望了一个颜色，但收到了一个字符串，是一种常见的错误。这是因为我们将字符串作为颜色来使用了。要解决这个问题，只需要将字符串转换为对应的颜色格式即可。在实际开发中，我们需要注意代码中数据类型的正确使用，以避免出现不必要的错误。
示例代码
$blue: "blue"; background-color: to-color($blue);
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/648bb9fe48841e9894a0380c