@700Hp

Почему возникает ошибка «undefined mixin»?

Mixin:
@mixin font($font_name, $file_name, $weight, $style) {
  @font-face {
    font-family: $font_name;
    font-display: swap;
    src: url('../fonts/#{$file_name}.woff') format('woff'),
      url('../fonts/#{$file_name}.woff2') format('woff2');
    font-weight: #{$weight};
    font-style: #{$style};
  }
}


Функция из gulp для работы со шрифтами:
function fontsStyle(cb) {
  let file_content = fs.readFileSync(srcPath + '/assets/scss/fonts.scss')
  if (file_content == '') {
    fs.writeFile(srcPath + '/assets/scss/fonts.scss', '', cb)
    return fs.readdir(path.build.fonts, function (err, items) {
      if (items) {
        let c_fontname
        for (var i = 0; i < items.length; i++) {
          let fontname = items[i].split('.')
          fontname = fontname[0]
          if (c_fontname != fontname) {
            fs.appendFile(
              srcPath + '/assets/scss/fonts.scss',
              '@include font("' +
                fontname +
                '", "' +
                fontname +
                '", "400", "normal");\r\n',
              cb
            )
          }
          c_fontname = fontname
        }
      }
    })
  }
  cb()
}


Ошибка:
Error: src\assets\scss\fonts.scss
Error: Undefined mixin.
  ╷
1 │ @include font('Barlow-Regular', 'Barlow-Regular', '400', 'normal');
  │ ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
  ╵
  src\assets\scss\fonts.scss 1:1  root stylesheet


Файл fonts.scss:
@include font('Barlow-Regular', 'Barlow-Regular', '400', 'normal');


Так же gulp не подключает шрифты в dist/assets/css/fonts.css файл абсолютно пустой.

Gulp запускается, работает, но шрифтов нет и ошибка в консоли. Что хочет sass? И как исправить.
  • Вопрос задан
  • 2876 просмотров
Решения вопроса 1
Прежде чем миксин использовать, его нужно подключить.
Ответ написан
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы