Я делаю активы перед компиляцией и запускаю приложение в производственном режиме. После компиляции, когда я загружаю свою страницу индекса, я получаю следующие предупреждения в консоли chrome:
Failed to decode downloaded font: http://localhost:3000/fonts/ionicons.ttf?v=2.0.0
prospects:1 OTS parsing error: invalid version tag
Failed to decode downloaded font: http://localhost:3000/fonts/ionicons.woff?v=2.0.0
prospects:1 OTS parsing error: invalid version tag
Проблема в том, что он не загружает иконки, а не показывает квадраты .
мы использовали пользовательские шрифты и код:
@font-face {
font-family: 'icomoon';
src: font-url('icomoon.eot');
src: font-url('icomoon.eot?#iefix') format('embedded-opentype'),
font-url('icomoon.ttf') format('truetype'),
font-url('icomoon.woff') format('woff'),
font-url('icomoon.svg#icomoon') format('svg');
font-weight: normal;
font-style: normal;
}
Я не знаю, чего не хватает с моей стороны. Я много искал и тоже пытался найти решение, но безуспешно. В режиме разработки он работает нормально, но не знаю, почему в рабочем режиме отображается квадрат.
css
asset-pipeline
ruby-on-rails-4.1
custom-font
Дипти Какаде
источник
источник
Ответы:
Я получил точно такую же ошибку, и в моем случае это произошло из-за неправильного пути для
@font-face
объявления. Веб-инспектор никогда не жаловался на 404, так как используемый нами dev-сервер (live-server) был настроен для обслуживания index.html по умолчанию на любых 404: s. Не зная каких-либо подробностей о вашей настройке, это может быть вероятным виновником.источник
CssRewriteUrlTransform
в BundleConfig.При работе на IIS в качестве сервера и .net 4 / 4.5 в Web.config могут отсутствовать определения расширений MIME / расширений файлов, например:
источник
У меня была такая же проблема.
, OTS parsing error: Failed to convert WOFF 2.0 font to SFNT (index):1 Failed to decode downloaded font: http://dev.xyz/themes/custom/xyz_theme/fonts/xyz_rock/rocksansbold/Rock-SansBold.woff2
Если вы получили это сообщение об ошибке при попытке зафиксировать ваш шрифт, это проблема с .gitattributes "
warning: CRLF will be replaced by LF
"Решением для этого является добавление любого шрифта, с которым вы получаете проблему в .gitattributes
Затем я удалил поврежденные файлы шрифтов и повторно применил новые файлы шрифтов, и теперь он работает отлично.
источник
пытаться
и переименуйте ваш файл в
application.css.scss
источник
У меня был поврежденный шрифт, хотя он, казалось, загружался без проблем, и в разделе «Источники в Chrome» показывалось, что devtools отображал, количество байтов было неправильным, поэтому я загрузил снова, и он решил это.
источник
Просто укажите формат @ font-face следующим образом:
источник
У меня была та же самая проблема, и это было из-за мерзости, рассматривающей эти файлы как текст. Поэтому при проверке файлов в агентах сборки двоичный файл не поддерживался.
Добавьте это в свой
.gitattributes
файл и попробуйте.источник
При использовании
angular-cli
, это то, что работает для меня:источник
Я получаю следующие ошибки:
которая была исправлена после загрузки исходного файла непосредственно с:
https://github.com/twbs/bootstrap/blob/master/fonts/glyphicons-halflings-regular.woff2
Проблема заключалась в том, что при загрузке файла произошла ошибка прокси-сервера (он содержал сообщение об ошибке HTML).
источник
Перейдите по адресу ниже на GitHub и загрузите каждый из файлов FontAwesome.
https://github.com/FortAwesome/font-awesome-sass/tree/master/assets/fonts/font-awesome
... но вместо того, чтобы щелкнуть правой кнопкой мыши и сохранить ссылку как, нажмите на каждый из файлов и используйте кнопку «Загрузить», чтобы сохранить их.
Я обнаружил, что сохранение ссылки в виде загруженной HTML-страницы, а не самого двоичного файла FontAwesome.
Как только у меня были все двоичные файлы, это работало на меня.
источник
Моя проблема заключалась в том, что я объявлял два шрифта, и scss, кажется, ожидает, что вы объявите имя шрифта.
после вашего
@font-face{}
вы должны объявить$my-font: "OpenSans3.0 or whatever";
и это для каждого шрифта-лица.
:-)
источник
Для пользователей angular- cli и webpack я подозревал, что при импорте шрифтов в файл css существует некоторая проблема, поэтому, пожалуйста, укажите URL-адрес, закодированный в одинарных кавычках, следующим образом:
Этот пост может быть старым, но это решение, которое сработало для меня.
источник
У меня была такая же проблема.
Добавление версии шрифта (например
?v=1.101
) к URL-адресам шрифта должно помочь;)Для доступа к версии шрифта достаточно щелкнуть (щелкнуть правой кнопкой мыши) версию TTF шрифта и выбрать «Свойства» (Mac OSX) «Свойства» (Windows) в контекстном меню.
источник
Если вы используете Chrome, попробуйте добавить версию шрифта opentype (OTF), как показано ниже:
Ура!
источник
Если вы используете bootstrap, обновите
bootstrap.min.css
файл начальной загрузки css ( ) и файлы шрифтов. Я исправил мою проблему с этим решением.источник
Я использую ASP.NET с IIS, и оказалось, что мне просто нужно было добавить MIME-тип в IIS: '.woff2' / 'application / font-woff'
источник
Попробовав множество других подходов, а также множество переустановок и проверок, я только что исправил проблему, очистив данные браузера Chrome (кэшированные изображения и файлы), а затем обновив страницу.
источник
У меня была такая же проблема, когда я открыл и сохранил
.woff
и.woff2
файлы через Sublime Text сEditorConfig
опциейend_of_line = lf
. Я просто скопировал файлы в папку шрифтов, не открывая их в Sublime, и проблема была решена.источник
Если другие ответы не сработали, попробуйте:
проверьте файл .htaccess
# Fonts
# Add correct content-type for fonts
AddType application/vnd.ms-fontobject .eot
AddType application/x-font-ttf .ttf
AddType application/x-font-opentype .otf
AddType application/x-font-woff .woff
AddType application/x-font-woff2 .woff2
AddType image/svg+xml .svg
очистить кеш сервера
источник
Проверьте CSS-файл вашего шрифта. (fontawesome.css / fontawesome.min.css) , вы увидите следующее:
Вы увидите тег версии после имени расширения вашего шрифта . Подобно:
Вам просто нужно удалить этот тег из вашего файла CSS. После удаления этого вам нужно перейти в папку со шрифтами, и вы увидите:
И, сформируйте файлы этих шрифтов, вам просто нужно удалить тег версии -v = 4.6.3 из имени файла.
Тогда проблема будет решена.
источник
на всякий случай это актуально для кого-то. Я получил точно такую же ошибку, используя ASP.NET и C # в Visual Studio. Когда я запустил приложение из визуальной студии, оно работало, но я получил эту проблему. Тем временем оказалось, что путь к моему проекту содержал символ «#» (c: \ C # \ testapplication). Это, кажется, сбивает с толку IIS Express (возможно, также IIS) и вызывает эту проблему. Я думаю, "#" - это зарезервированный символ где-то в ASP.NET или ниже. Смена пути помогла и теперь работает как положено.
С уважением Кристоф
источник
code
Не удалось декодировать загруженный шрифт: localhost: 52963 / css /…Что помогло мне, так это то, что я сменил порядок. Сначала загружается .eot get, но моя ошибка была при загрузке .eot. Поэтому я отказался от .eot в качестве первого src для woff2, и ошибка исчезла.
Итак, код сейчас:
И это было:
источник
источник
У меня была та же проблема, это работало для меня https://github.com/webpack/webpack/issues/1468
источник