Проблема вложенности импорта шрифтов SASS

Question

В моем приложении для реагирования у меня есть структура папок:

src
 -assets
   -fonts
 -components
   -NormalComponents
   -ContentCards
     -CardType1
     -CardType2
 -containers
 -styles
 etc

Я импортирую файл mixin.scss, который находится в папке styles.Он содержит функцию mixin для импорта шрифтов по следующему пути: src/assets/fonts/myfonthere.ttf

Вот моя функция:

@mixin font-face($font-family, $file-path) {
    @font-face {
        font-family: $font-family;
        src: url('#{$file-path}.eot');
        src: url('#{$file-path}.woff');
        src: url('#{$file-path}.ttf');
    }
}

@include font-face(MyFont-Bold, '../assets/fonts/MyFont-Bold');

Я могу импортировать этот mixin без ошибок на уровне src/components/NormalComponentsоднако, когда я импортирую в src/components/ContentCards/CardType1, ошибки выдаются.

Ошибка : Module not found: Can't resolve '../../assets/fonts/MyFont-Bold.eot'

Это связано со структурой вложенных папок для компонента Карты содержимого?Есть ли способ обойти это, чтобы я мог импортировать миксин на любом уровне и не иметь этой проблемы?

Answer 1

Не думаю, что это проблема структуры вложенных папок. Возможно ли, что вы импортируете миксин-файл из каталога стилей, после добавления еще доктора, ваш {file-path} что-то неправильно?