Question

我们最近成功升级到Font Awesome 5，或者我们想到了。

我们遇到的一个奇怪的问题是，某些FA5图标没有显示，但有时只显示。也就是说，在某些页面上有图标，但在其他页面上则不是。

一切正常在本地和我们的测试服务器上运行。我们在生产服务器上看到了这一点。

我们使用mixin：

以相同的方式设置所有图标

@mixin icon(
  $name
) {
  $font-icon: map-get($font-icons, $name);

  @if $font-icon {
    font-family: 'Font Awesome 5 Free';

    content: fa-unicode($font-icon);
    font-weight: fa-weight($font-icon);
  } else {
    // use an image, deleted to keep it short
  }

其中$font-icons在FontAwesome unicode和font-weight的名称和元组之间进行映射：

$font-icons: (
  filter: ($fa-var-filter, 900),
  // etc etc

$fa-var-filter在Font Awesome的_variables.scss中定义为$fa-var-filter: \f0b0;。

为了完整性，这里有两个辅助函数：

@function fa-unicode($font) {
  @return unquote("\"#{ nth($font, 1) }\"");
}

@function fa-weight($font) {
  @return nth($font, 2)
}

在思考这个机制如何在同一页上有如此不同的结果时，我倾向于打破指南针或sass的编译。但真的不是最模糊的。

只有一些FontAwesome 5图标没有显示，有时只显示

0 个答案: