FontAwesome 无法在本地和电子应用程序中加载字体

问题描述

我已经使用 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 的加载方式如下: