javascript - Bootstrap woff2 字体未正确加载

Question

引导字体未正确加载 glyphicons-halflings-regular.woff2。

它在我的 Chrome 控制台中显示错误。

有什么解决方案可以让它正确加载，这样它就不会在控制台中显示错误？

Answer 1

由于您在帖子上放置了 asp.net-mvc 标签，因此我为您提供 IIS 配置解决方案。

当您的 Web 服务器未配置 MIME 类型“woff”或“woff2”时，Chrome 不会消耗 woff 并引发 404 错误。

---

您需要为 woff2 添加 IIS 一个 MIME-TYPE。您可以在 web.xml 中配置它。

 <system.webServer>
  <staticContent>
    <remove fileExtension=".woff2" />
    <mimeMap fileExtension=".woff2" mimeType="application/font-woff2" />
  </staticContent>
</system.webServer>

---

您也可以通过 IIS 管理器执行此操作。

1. 打开 IIS 管理器
2. 功能视图 -> MIME 类型
3. 操作 -> 添加
4. 您将看到添加 MIME 类型框并将 woff2 扩展名放在文件扩展名“.woff2”中
5. 并且 MIME 类型也为“application/font-woff2”。

---

IIS 管理器通过图像解决。

Answer 2

通过在 Views 文件夹下为 IIS 添加Web.config中的标记，解决了相同的问题。

Answer 3

一个小技巧 1) 搜索 glyphicons-halflings-regular.woff 2) 将 glyphicons-halflings-regular.woff 复制为 glyphicons-halflings-regular.woff2 3) 将其放入所需文件夹。它在我的情况下有效。