С помощью узловых модулей я добавил этот файл в мою тему. Но это отображается в "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
Ranjit 17 Сен 2020 в 15:22

1 ответ

Лучший ответ

Чтобы избавиться от этой ошибки, вам нужно избавиться от @import (который здесь переводится как src url). Директива @import блокирует параллельные загрузки. Вы должны изменить код, чтобы импортировать woff в основной html с тегом ссылки.

0
Pitis 1 Окт 2020 в 23:07