невозможно использовать локальную папку @ font-face SCSS - PullRequest
0 голосов
/ 21 марта 2019

У меня есть два файла шрифтов "ttf", которые я должен использовать с Sass - SCSS, и я не могу использовать его непосредственно из папки

enter image description here

Мой _mixin.scss файл:

@mixin font-face($font-name, $font-path, $font-weight, $font-style) {
  @font-face {
    font-family: "Lato-Bold";
    src: url("../../css/fonts/Lato/Lato-Bold.ttf") format('truetype');
    font-weight: 700;
    font-style: bold;
  }
}

Это правильно?

это дает мне ОШИБКУ при компиляции ... я впервые использую файлы font-face и ttf. Это проект, поэтому я не могу добавить другие шрифты, я должен использовать его таким образом, вы можете мне помочь?

Как я могу использовать этот миксин, как включить его в семейство шрифтов в мой CSS и / или HTML?

Я пытаюсь записать это в свой файл _typography.scss , и это приводит к ошибке ":

@include font-face("Lato-Bold", "../../css/fonts/Lato/Lato-Bold", 700, bold);

ОШИБКА в ./src/scss/main.scss (./node_modules/css-loader/dist/cjs.js!./node_modules/sass-loader/lib/loader.js!./src/scss/main .scss) Модуль не найден: ошибка: не удается разрешить '../../css/fonts/Lato/Lato-Bold.ttf' в '/ Users / **** / Desktop / **** / src / scss' @ ./src/scss/main.scss (./node_modules/css-loader/dist/cjs.js!./node_modules/sass-loader/lib/loader.js!./src/scss/main.scss)

PS: я использую webpack.config.js | webpack-dev-server и компиляция sass с помощью --watch

Спасибо за помощь!

1 Ответ

0 голосов
/ 21 марта 2019

попробуйте это в вашем миксине

@mixin font-face($font-name, $font-path, $font-weight, $font-style) {
  @font-face {
    font-family: $font-name;
    src: url(#{$font-path});
    font-weight: $font-weight;
    font-style: $font-style;
  }
}
...