Css Sass本地编译不'；不工作，代码笔工作

我正试图编译这段.scss代码：

$main-color:#06c;

:root{
        --main-color-05: adjust-color($main-color, $lightness: +51%);}

---

当我编译时，我得到以下结果：

本地（sass-v:sass 3.5.2（前沿））

代码笔（）

---

本地编译器似乎忽略了自定义属性中的调整颜色函数，该函数在类声明中起作用：

$main-color:#06c;

:root{
        --main-color-05: adjust-color($main-color, $lightness: +51%);}

.main-color-05{
    background-color: adjust-color($main-color, $lightness: +51%);}

---

(汇编)

---

提前感谢

您可以使用一些sass mixin来设置自定义属性。请看一看

或者像这样使用npm模块

:root {
  --main-color-05: #d1e8ff;}

$main-color:#06c;

:root{
        --main-color-05: adjust-color($main-color, $lightness: +51%);}

.main-color-05{
    background-color: adjust-color($main-color, $lightness: +51%);}

:root {
      --main-color-05: adjust-color($main-color, $lightness: +51%); }

    .main-color-05 {
      background-color: #d1e8ff; }

// SCSS
$rootVars: ();

@mixin setVarSass($varName, $value){
  $rootVars: map-merge($rootVars, (
    #{$varName}: $value
  )) !global;
}

@function getVarSass($varName){
  @return map-get($rootVars, #{$varName});
}

@include setVarSass("color", #f00);

// CSS
@mixin setVarCss($varName, $value){
  @supports ( (--a: 0)) {
    // Custom properties are supported in the browser
    $varName: unquote($varName);
    :root{
      #{--$varName}: $value;
    }
  }
}

@function getVarCss($varName){
  $varName: unquote($varName);
  @return #{var(--$varName)};
}

// Common
@mixin setVar($varName, $value){
  @include setVarSass($varName, $value);
  @include setVarCss($varName, $value);
}

@mixin setPropFromVar($propName, $varName){
  @supports ( (--a: 0)) {
    // Custom properties are supported in the browser
    #{$propName}: getVarCss($varName);
  }

  @supports ( not (--a: 0)) {    
    // Custom properties are NOT supported in the browser
    #{$propName}: getVarSass($varName);
  }
}

// SET/GET
@include setVar('main-color', #f00);

body {
  @include setPropFromVar('color', 'main-color');
}