创建SCSS主题错误

Question

I have file themes.scss under /javascript/components/themes.scss

Here is code in it

   $themes: (
  flysmarter:(
    searchFieldBorder:1px solid #0A5AA6,
    searchFieldBackgound:#FFF,
    searchFieldColor: #0A5AA6,
  ),
  flygcity:(
      backgroundColor:#eccc00,
  ),

);
@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);
  }

I need to import it in file that under ../components/searchfield/styles/searchfield.css

I wrote import like this @import url('../component/themes.scss');

But when I run webpack I have this error.

Module build failed: @include themify($themes) { ^ No mixin named themify

When files in same directory, all okay. How I can fix it?

Answer 1

I found solution

Just need to write this

@import '../../themes.scss';

And now it works.