FontAwesome无法在本地和electron app中加载字体

Question

我使用npm下载了FontAwcle，然后使用grunts复制任务将css文件和字体复制到我的电子应用程序的root diretory中的正确文件夹中。

到目前为止还不错。一切都在它应该在的地方。

现在，当我在我的应用程序中引用FontAwgood时，图标不会加载。这些是我在控制台中遇到的错误：

无法解码下载的字体：
file:///path/to/fonts/fontawesome-webfont.woff2?v=4.4.0OTS分析错误：无法将WOFF 2.0字体转换为SFNT

无法解码下载的字体：
file:////path/to/fonts/fontawesome-webfont.woff?v=4.4.0
OTS分析错误：WOFF标头中的文件大小不正确

无法解码下载的字体：
file:////path/to/fonts/fontawesome-webfont.ttf?v=4.4.0
OTS分析错误：表目录的entrySelector不正确

我已经尝试通过删除所有版本参数来修改FontAwcle的css文件，但这似乎不是问题所在。通过电子启动应用程序会出现问题。以及在浏览器中查看html文件时出现问题。

使现代化

要回答一些评论：

• 这个问题在electron和浏览器（在chrome和firefox中测试）中都会出现
• 我正在使用这两个版本的最新版本，FontAwesome（4.4.0）和Electron（0.32.1）（通过npm全新安装）
• css的加载方式如下：<代码>

Answer 1

我也面临同样的问题，使用API网关在Amazon S3上提供静态字体文件。

我通过在AWS控制台上将*/*添加为二进制媒体类型来修复它。

有关二进制媒体类型管理的更多信息https://docs.aws.amazon.com/apigateway/latest/developerguide/api-gateway-payload-encodings-configure-with-console.html

Answer 2

在我的情况下，Git将文件视为文本文件，并弄乱其“行尾”。这正在损坏文件。

调整. gitconfig以将*. woff文件识别为二进制文件，然后删除文件，并从https://github.com/FortAwesome/Font-Awesome/raw/v4.2.0/fonts/fontawesome-webfont.woff添加一个新副本，为我解决了这个问题。

Answer 3

我有一个类似的问题（也许这个答案会帮助别人）。我使用Maven构建项目（Java JS）。Maven Filter插件损坏的二进制字体文件。我必须添加包括和排除：

    <resources>
        <resource>
            <directory>${project.sources}</directory>
            <filtering>true</filtering>
            <excludes>
                <exclude>**/*.woff</exclude>
                <exclude>**/*.ttf</exclude>
            </excludes>
        </resource>
        <resource>
            <directory>${project.sources}</directory>
            <filtering>false</filtering>
            <includes>
                <include>**/*.woff</include>
                <include>**/*.ttf</include>
            </includes>
        </resource>
    </resources>