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

Question

[700Hp]

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? И как исправить.

Answer 1

[Алексей Уколов]

Прежде чем миксин использовать, его нужно подключить.

Comments

[700Hp]

Код mixin находится в главном файле style.scss. Файл fonts.scss подключен с помощью import к нему.
Не понимаю, что ещё нужно подключить?
Заранее спасибо

[Алексей Уколов]

Тогда вам нужно переименовать файл в _fonts.scss, чтобы компилятор понимал, что его не нужно собирать отдельно от основного файла.

[700Hp]

Алексей Уколов, помогло, спасибо.
Коль не секрет, где сказано об особенности нижнего подчёркивания?

[Алексей Уколов]

Да всё в той же доке: https://sass-lang.com/guide#topic-4