Question

我在Angular应用程序中使用自定义字体文件。它在角度2下运行良好。我最近升级到了Angular 4。现在我面临的问题是每当我更新字体文件时。构建后不会显示更新的字体。可能的原因是什么？

@font-face {
  font-family: "bm-dashboard-font";
  src:url("../../../assets/fonts/bm-dashboard-font.eot");
  src:url("../../../assets/fonts/bm-dashboard-font.eot?#iefix") format("embedded-opentype"),
  url("../../../assets/fonts/bm-dashboard-font.woff") format("woff"),
  url("../../../assets/fonts/bm-dashboard-font.ttf") format("truetype"),
  url("../../../assets/fonts/bm-dashboard-font.svg#bm-dashboard-font") format("svg");
  font-weight: normal;
  font-style: normal;

}

编辑：我正在使用AOT

Answer 1

请使用绝对路径，而不是相对。

@font-face {
   font-family: "bm-dashboard-font";
   src:url("/assets/fonts/bm-dashboard-font.eot");
   src:url("/assets/fonts/bm-dashboard-font.eot?#iefix") format("embedded-opentype"),
   url("/assets/fonts/bm-dashboard-font.woff") format("woff"),
   url("/assets/fonts/bm-dashboard-font.ttf") format("truetype"),
   url("/assets/fonts/bm-dashboard-font.svg#bm-dashboard-font") format("svg");
   font-weight: normal;
   font-style: normal;
}

在Angular 4中构建后，自定义字体不会出现

1 个答案: