FontAwesome 无法在本地和电子应用程序中加载字体
时间：2023-01-29问题描述
我已经使用 npm 下载了 FontAwesome，然后使用 grunts 复制任务将 css 文件和字体复制到我的电子应用程序根目录中的正确文件夹中.
I have downloaded FontAwesome using npm and then copied the css-file and the fonts into the right folders in the root-diretory of my electron-application using grunts copy task.
到目前为止一切顺利.一切都在它应该在的地方.
So far so good. Everything is where it is supposed to be.
现在，当我在我的应用程序中引用 FontAwesome 时，图标不会被加载.这些是我在控制台中遇到的错误:
Now, when i am referencing FontAwesome in my app, the icons do not get loaded. These are the errors that I get in the console:
解码下载的字体失败:
file:///path/to/fonts/fontawesome-webfont.woff2?v=4.4.0
OTS 解析错误:无法将 WOFF 2.0 字体转换为 SFNT
Failed to decode downloaded font:
file:///path/to/fonts/fontawesome-webfont.woff2?v=4.4.0
OTS parsing error: Failed to convert WOFF 2.0 font to SFNT
解码下载的字体失败:
file:////path/to/fonts/fontawesome-webfont.woff?v=4.4.0
OTS 解析错误:WOFF 标头中的文件大小不正确
Failed to decode downloaded font:
file:////path/to/fonts/fontawesome-webfont.woff?v=4.4.0
OTS parsing error: incorrect file size in WOFF header
解码下载的字体失败:
file:////path/to/fonts/fontawesome-webfont.ttf?v=4.4.0
OTS解析错误:表目录的entrySelector不正确
Failed to decode downloaded font:
file:////path/to/fonts/fontawesome-webfont.ttf?v=4.4.0
OTS parsing error: incorrect entrySelector for table directory
我已经尝试通过删除所有版本参数来修改 FontAwesome 的 css 文件，但这似乎不是问题.通过 electron . 启动应用程序以及在浏览器中查看 html 文件时都会出现问题.
I have already tried to modify FontAwesome's css file by removing all the version parameters but this does not seem to be the problem. The Issues comes up both by starting the app via electron . and when viewing the html-file in the browser.
更新
回答一些评论:
- 此问题出现在电子和浏览器中(在 chrome 和 firefox 中测试)
- 我使用的是最新版本的 FontAwesome (4.4.0) 和 Electron (0.32.1)(通过 npm 全新安装)
- css 的加载方式如下:
推荐答案
问题出在我的 grunt 文件中.我试图通过简单地在他们的供应商网站上手动下载所有依赖项并将它们放在我项目的相应脚本文件夹中来重现该问题 - 突然它起作用了.
The Problem was in my grunt-file. I tried to reproduce the issue by simply downloading all dependencies manually at their vendors websites and placed them in the corresponding script-folder of my project - suddenly it worked.
我现在切换到 gulp，它仍然有效.不知道我在 grunt 上做错了什么......
I switched to gulp now and it still works. No idea what i was doing wrong with grunt though...
这篇关于FontAwesome 无法在本地和电子应用程序中加载字体的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持跟版网！
相关文章
谷歌应用程序脚本从二进制文件中获取字节范围Google apps script get range of bytes from binary file(谷歌应用程序脚本从二进制文件中获取字节范围)- 使用 Google 脚本从 Google Drive 发送多个附件Sending Multiple attachments with Google Script from Google Drive(使用 Google 脚本从 Google Drive 发送多个附件)
- 在您的公司网络中分发适用于表格的 Google Apps 脚本Distributing Google Apps Scripts for Sheets in your company network(在您的公司网络中分发适用于表格的 Google Apps 脚本)
- 使用 javascript 将文件从任何人上传到我的谷歌驱动器Upload file to my google drive from anyone using javascript(使用 javascript 将文件从任何人上传到我的谷歌驱动器)
- “共享驱动器"Google Apps 脚本中的支持quot;Shared Drivequot; support in Google Apps Script(“共享驱动器Google Apps 脚本中的支持)
- Angular 2+ HTTP POST 和 GDrive API.带名称的可恢复文件上传Angular 2+ HTTP POST and GDrive API. Resumable file upload with name(Angular 2+ HTTP POST 和 GDrive API.带名称的可恢复文件上传)