С помощью узловых модулей я добавил этот файл в мою тему. Но это отображается в "Google Pagespeed Insight". Рассмотрите возможность использования <link rel=preload>
для определения приоритета выборки ресурсов, которые в настоящее время запрашиваются позже при загрузке страницы .
В моем файле CSS он импортируется так.
@font-face {
font-family: 'Graphik Web';
src: local('Graphik Web'), url('#{$spirit-font-path}Graphik-Regular-Web.woff2') format('woff2'),
url('#{$spirit-font-path}Graphik-Regular-Web.woff') format('woff');
font-weight: 400;
font-style: normal;
font-stretch: normal;
font-display: swap;
}
Но все равно не работает, как в отчете от Google Pagespeed Insight. Пожалуйста, дайте мне знать, если я что-то пропустил или что-то добавлю.
1 ответ
Чтобы избавиться от этой ошибки, вам нужно избавиться от @import (который здесь переводится как src url). Директива @import блокирует параллельные загрузки. Вы должны изменить код, чтобы импортировать woff в основной html с тегом ссылки.
Похожие вопросы
Новые вопросы
css
CSS (каскадные таблицы стилей) - это язык таблиц стилей представления, используемый для описания внешнего вида и форматирования документов HTML (язык разметки гипертекста), XML (расширяемый язык разметки) и элементов SVG, включая (но не ограничиваясь) цвета, макет, шрифты, и анимации. Также описывается, как элементы должны отображаться на экране, на бумаге, в речи или на других носителях.