在 Meteor-React-Apollo-Graphql 堆栈中使用 Stylus 导入字体

Question

我的 Meteor 根目录中有一个 styles.styl 文件，我可以很好地加载它。但是，当我尝试导入自定义字体时，none 它会在我加载页面的任何浏览器中加载。

@font-face
    font-family Futura
    font-style Extra Bold
    src url(imports/ui/assets/fonts/Futura/FuturaExtraBold.otf) format(opentype),
    url(imports/ui/assets/fonts/Futura/FuturaExtraBold.ttf) format(truetype),
    url(imports/ui/assets/fonts/Futura/FuturaExtraBold.eot) format(embedded-opentype),
    url(imports/ui/assets/fonts/Futura/FuturaExtraBold.woff) format(woff),
    url(imports/ui/assets/fonts/Futura/FuturaExtraBold.svg) format(svg)

请注意，导入是相对于 styles.styl 文件的。我怀疑这是一个导致此问题的路径问题，但我尝试过的所有方法都无法解决此问题。

将我的字体放入 public/ 文件夹
使用mys:fonts重新映射字体路径。执行此操作后，当我在 URL 栏中键入 <ip address>:3000/fonts/Futura/FuturaExtraBold.ttf 时，我就可以下载该文件。但是，该资源仍未加载以在我的站点中使用。
将 Fonts 文件夹移动到根目录、客户端和其他子目录中，都无济于事（当然更新 styles.styl.

感谢任何帮助。

谢谢。

更新：我使用 mys:fonts 包重新映射我的字体文件路径，然后我重新映射我的文件路径，所以现在 http://<ipaddress>:3000/fonts/Futura/FuturaExtraBold.ttf 等等是我可以访问的链接，它会下载字体.但出于某种原因，.otf、.ttf 和 .woff 在我的控制台中引发了这个错误：

Failed to decode downloaded font: http://<ipaddress>:3000/fonts/Futura/FuturaExtraBold.woff (index):1 OTS parsing error: invalid version tag

但是当我前往 http://<ipaddress>:3000/fonts/Futura/FuturaExtraBold.woff 时，我的网站显示完全 正常，加载和解释了 Futura 字体。这显然不是预期的结果，但我真的不确定如何解决这个问题。

Answer 1

所以在我玩了之后，我设法通过将我的字体放在我构建的根目录中的 public/ 文件夹中来让它工作。我之前确实尝试过，但它没有按预期工作，因此我不确定为什么它现在似乎可以工作。当我将它放在 public 文件夹中（在没有任何缓存的隔离环境中加载）时，可能是我缺乏足够的测试。

无论如何，这现在有效了。

我的字体位于 public/ 中名为 fonts/ 的文件夹中，并导入到我的 styles.styl 文件中，文件路径为 url(fonts/font.woff).

在 Meteor-React-Apollo-Graphql 堆栈中使用 Stylus 导入字体

Importing fonts with Stylus in a Meteor-React-Apollo-Graphql Stack

css

fonts

stylus

meteor

reactjs