从ionic2中的资产文件夹加载字体时出错答案

【问题标题】：error while loading fonts from assests folder in ionic2从ionic2中的资产文件夹加载字体时出错
【发布时间】：2017-08-31 04:17:40
【问题描述】：

在开发离子应用程序时，我使用了一些图标和图像。问题是现在我的应用程序无法正确显示图标。在控制台中出现这些错误

Failed to load resource: the server responded with a status of 404 (Not Found)----ionicons.woff2

'roboto-medium.ttf','roboto-regular.ttf','ionicons.woff','ionicons.woff','roboto-regular.woff'存在这些错误

 localhost:portnumber/build/assets/fonts/roboto-light.ttf 404 (Not Found)

我什至没有在我的应用程序中使用任何字体，但是为什么这会影响显示图标

科尔多瓦 CLI：6.5.0
Ionic 框架版本：2.0.0
Ionic CLI 版本：2.2.1
Ionic 应用程序库版本：2.2.0
Ionic 应用脚本版本：1.0.0
ios-deploy 版本：未安装
ios-sim 版本：未安装
操作系统：Linux 3.13
节点版本：v7.7.2
Xcode 版本：未安装

我已经与我以前的同一个应用程序副本进行了交叉检查，发现 @font-face 的 main.css 文件中的路径从 ../assets/fonts 更改为 assets/fonts/ionicons.woff2 。我认为这是根本原因，但我尝试更改它，运行应用程序后未应用更改。如何解决此问题。

【问题讨论】：

您是使用自己的图标和图像.. 还是使用离子图标..？
我正在使用 ionicons
哦.. 打开项目中的 www 文件夹并导航到 assets -> fonts.. 检查错误消息中的所有 4 个文件是否都存在。然后尝试再次构建项目并运行它..（如果错误仍然存在，请发布您当前使用的cli版本和ionic版本）
是的，所有这些文件都在 www/assets/fonts 中。

标签： ionic2

【解决方案1】：

经过一番挣扎，我找到了解决方案。即在“主题”文件夹中更改 variable.scss 文件。更改变量 $font-path 的路径解决了所有问题。$font-path: "../assets/fonts";

【讨论】：

嗨。我已经有了像$font-path: "../assets/fonts" 这样的路径，但是没有安装字体。我的问题是Roboto 字体。它们没有被添加到assets/fonts 内有什么想法吗？

【解决方案2】：

对我来说也有同样的问题。

由于一些修改，这些文件丢失了，我得到了解决-

$ npm install
服务器重启ionic serve --lab

对我来说很棒。

希望它也对你有用。

【讨论】：

【解决方案3】：

如果您不需要 Roboto 字体，只需在 variables.scss 中删除这一行 @import "reboto"

【讨论】：

【解决方案4】：

在我的情况下，以下是对错误的修复：将此 mime 添加到您的 web.config：

<configuration> <system.webServer> <staticContent> ...
<!--
    https://stackoverflow.com/questions/28235550/proper-mime-type-for-woff2-fonts
  -->   
            <remove fileExtension=".woff2" />
            <mimeMap fileExtension=".woff2" mimeType="font/woff2" />

【讨论】：