Material Design 图标突然停止工作答案

【问题标题】：Material Design Icons Suddenly Stopped WorkingMaterial Design 图标突然停止工作
【发布时间】：2017-04-28 16:41:42
【问题描述】：

我一直在开发 Cordova 应用程序，我一直在使用三星 SM-J700P 进行测试。

我对 Material Icons 的设置基本上是这样的：

HTML -

<div id="alarm"><i class="material-icons">add_alert</i></div>

CSS -

@font-face {
    font-family: 'Material Icons';
    font-style: normal;
    font-weight: 400;
    src:
      url(./path/to/MaterialIcons-Regular.woff2) format(woff2),
      url(./path/to/MaterialIcons-Regular.woff) format(woff);
}

我在我的项目中本地保存了 Material Icons 包，因此获取图标应该没有任何问题。这一直在这款手机上进行测试，直到几天前，我收到了我的 SM-J700P 的更新。之后，我的图标都不再出现。手机当前软件版本为：J700PVPS1AQD1。

因为 Cordova 在 Android 上默认使用 chromium 窗口，所以我应该只需要 woff2 包来存放图标，所以我怀疑这是问题所在。当我运行程序时，我的 Android Studio 控制台中也出现了一个奇怪的错误。

E/libEGL: validate_display:225 error 3008 (EGL_BAD_DISPLAY)
I/OpenGLRenderer: Initialized EGL, version 1.4
W/AudioCapabilities: Unsupported mime audio/mpeg-L1
W/AudioCapabilities: Unsupported mime audio/mpeg-L2
//... Lots more Unsupported mime types which I don't understand...
E/chromium: [ERROR:interface_registry.cc(104)] Failed to locate a binder for interface: autofill::mojom::PasswordManagerDriver
More unsupported mime types...

我不知道控制台中的这些错误有多重要，但它们在更新后也是新的。该应用程序的其余部分工作正常，这些错误都不会导致它崩溃，它只是不再显示材质图标。

有什么想法吗？

编辑：更多信息。如果我只是在我自己的 chrome 浏览器中显示 html 文件，图标会正常显示。所以看起来这可能是科尔多瓦的问题。我还使用三星 S7 Edge 测试了该应用程序，它也不会显示图标，因此它似乎不依赖于手机。

【问题讨论】：

标签： android cordova material-design

【解决方案1】：

答案很简单。在 CSS 中，我忘记了引号。

所以：

@font-face { 
    font-family: 'Material Icons';
    font-style: normal;
    font-weight: 400;
    src:
      url(../Path/To/MaterialIcons-Regular.woff2) format (woff2);
}

应该是：

@font-face {
    font-family: 'Material Icons';
    font-style: normal;
    font-weight: 400;
    src:
      local('Material Icons'),
      local('MaterialIcons-Regular'),
      url(../Path/To/MaterialIcons-Regular.woff2) format ('woff2');
}

这是根据谷歌文档here

【讨论】：

【解决方案2】：

你忘了这里的引号（format之后）：

  url(../Path/To/MaterialIcons-Regular.woff2) format ('woff2');

【讨论】：