По какой причине не работают шрифты в scss?

Question

[Даниил Архипов]

Вот папка
В fonts находятся все шрифты, в stylesheet лежит css и scss.



Путь указывал разный и с точками и без. Не работает...

Comments

[Сергей delphinpro]

Что по этому поводу говорит консоль?

ЗЫ Код не надо (и даже нельзя по правилам сайта) выкладывать картинками.

Answer 1

[Сергей delphinpro]

Попробуйте указывать правильный путь к файлам шрифтов.

|--fonts
|  `--myfont.woff2
`--css
   `--style.css

нужно указывать относительно css файла

../fonts/myfont.woff2

Шрифты не будут работать, если вы просто открываете html-файл в браузере.
Необходимо использовать web-сервер.

Comments

[Даниил Архипов]

Я использую плагин live сервер от vs code. Раньше подключал шрифты по cdn и все работало. Сейчас решил скачать к себе и установить, но по итогу не работает. С путем который указали вы, так же не помогло

[Ivan Ustûžanin]

Даниил Архипов, потому что нужно включить немного голову и или понять куда ложатся скомпилированные стили и от этого пути указывать пути до шрифтов (если SCSS не преобразует пути сам), или понять, что в нарисованной структуре нужны пути ../../fonts/, т.к. отвечающий приводил общий принцип, а не конкретное решение

[szQocks]

Даниил Архипов, убери пробелы в названиях, и выйти надо на 2 уровня выше , то есть что бы в файле _fonts.scss достучать до шрифта который лежит в папке fonts, надо сделать путь такой '../../fonts/название.woff2'

[Сергей delphinpro]

Ivan Ustûžanin, szQocks, не нужно два уровня. От сss файла только один уровень. А scss сам никогда не умел пути резолвить, они остаются как есть в исходниках.

Даниил Архипов, вы должны понять, что фраза "не работает" вообще нисколько не является описанием проблемы. По ней ничего нельзя даже предположить.

Хотя бы откройте консоль браузера, и посмотрите по каким путям реально пытается загрузиться шрифт.

[Сергей delphinpro]

И да, от пробелов в именах файлов и папок всегда избавляйтесь. Старайтесь использовать только латинский алфавит, цифры, и знаки "_", "-", ".".