mixin в _var.scss не попадает внутрь компонентов в Angular

Question

Я использую mixin для тематических целей.

_var.scss (в местоположении src)

$themes:(
    default:(
        primaryLight:#3c5689
    ),
    lightBlue:(
        primaryLight:#3c5689
    ) ); /*  * Implementation of themes  */  @mixin themify($themes) {
    @each $theme, $map in $themes {
      .theme-#{$theme} & {
        $theme-map: () !global;
        @each $key, $submap in $map {
          $value: map-get(map-get($themes, $theme), '#{$key}');
          $theme-map: map-merge($theme-map, ($key: $value)) !global;
        }
        @content;
        $theme-map: null !global;
      }
    }   }
     @function themed($key) {
    @return map-get($theme-map, $key);   }

Я пытаюсь позвонить из style.scss следующим образомкак это.Это работает.Но я не могу звонить изнутри компонентов.

header {
    @include themify($themes) {
        background: themed('primaryLight');  
      }
    }

Как я вызываю этот миксин из другого компонента css. (Я уже дал ссылку @import)