Получение ошибки при использовании префикса для переменной , импортированной с помощью @use с @forward, однако использование префикса в миксине работает, как и ожидалось.
Примечание. также попытался заменить'- 'на' _ ',' 'и отчаянно удалил' $ ', который, как я полагал, никогда не сработает. Безуспешно.
Это записывается @forward "" как - * и добавляет префикс к началу каждого миксина, функции и имени переменной, передаваемых модулем - cite: https://sass-lang.com/documentation/at-rules/forward
Вариант использования
_colors.s css
// Variable.
$primary-color-var: red;
// Mixin.
@mixin primary-color-mixin-example {
$primary-color: red;
}
_all- modules.s css
@forward './colors' as colors-*;
sample-component.s css
@use '../modules/all-modules' as foo;
.sample-component {
@include foo.colors-primary-color-mixin-example; // Works.
}
.sample-component {
color : foo.colors-$primary-color-var; // Throws an error.
}
Сообщение об ошибке
Error: expected "(".
╷
6 │ color : colors.fonts-$primary-color-var;
│ ^
╵
src/sass/components/sample-component.scss 6:21 root stylesheet
Дополнительный контекст
Я бы предпочел не использовать миксин, потому что я хотел бы присвоить импортированную переменную локальной переменной, что, по-видимому, невозможно, если @incIN включает миксин; $local-primary-color: foo.colors-$primary-color-var;