Mixin не видит переменную

#css #sass

#css #sass

Вопрос:

столкнулся с ошибкой: mixin не видит переменную во внешней среде, куда она была включена.

Пример вставки mixin:

 button.endBurger {
    $color: rgba(247, 181, 82, $opacity-bg_conf); // variable that mixin does not see
    background-color: $color;
    width: 250px;
    @include hover-active_add-buts;
}
  

Смешивание:

 @mixin hover-active_add-buts {
    amp;:hover {
        background: darken($color, $darken-k_add-buts);
    }
    amp;:active {
        background: darken($color, $darken-k-act_add-buts);
    }
}
  

Код ошибки:

Ошибка: Неопределенная переменная: «$ color»

Комментарии:

1. вы можете определить свою переменную в одном файле и импортировать ее в основной файл, который вы используете.

2. @deepak, нет, я не могу. Существует много похожих правил, и переменная в них всегда содержит разные

Ответ №1:

область $color не является глобальной, вам нужно передать ее в качестве аргумента :

 button.endBurger {
    $color: rgba(247, 181, 82, $opacity-bg_conf); // переменная, которую не видит миксина
    background-color: $color;
    width: 250px;
    @include hover-active_add-buts($color);
}

@mixin hover-active_add-buts($color) {
    amp;:hover {
        background: darken($color, $darken-k_add-buts);
    }
    amp;:active {
        background: darken($color, $darken-k-act_add-buts);
    }
}