Javascript CSS@font-face未加载字体文件。但是文件路径是正确的（我可以获取它）

我有一些CSS，里面有一个

@字体

：

@字体{
src:url（'file:///Users/trusktr/src/my-project/node_modules/my-lib/dist/assets/fonts/AvenirNext/AvenirNext-DemiBold.woff格式（'woff'）；
src:url（'file:///Users/trusktr/src/my-project/node_modules/my-lib/dist/assets/fonts/AvenirNext/AvenirNext-DemiBold.svg格式（'svg'）；
src:url（'file:///Users/trusktr/src/my-project/node_modules/my-lib/dist/assets/fonts/AvenirNext/AvenirNext-DemiBold.truetype格式（'truetype'）；
字体系列：AvenirNext；
src:url（'file:///Users/trusktr/src/my-project/node_modules/my-lib/dist/assets/fonts/AvenirNext/AvenirNext-DemiBold.eot');
字体风格：普通；
}
* {
背景：红色；
}
.App-root-1{
宽度：100%；
身高：100%；
溢出：隐藏；
}

当我查看“网络”选项卡时，我没有看到对这些字体文件的任何请求

但是，如果我使用其中一个函数创建

fetch（）

调用，我会在控制台中看到输出：

fetch（'file:///Users/trusktr/src/my-project/node_modules/my-lib/dist/assets/fonts/AvenirNext/AvenirNext-DemiBold.svg）。然后（r=>r.text（））。然后（console.log）

我看到类似的东西

...

---

所以我想知道，如果我在网络选项卡中没有看到字体文件的请求，这是否意味着它没有加载？如果它没有加载，为什么不呢？我是否在

@font-face

规则中做错了什么？

我可以通过将

url（）

s放入一个

src

属性使其正常工作：

@font-face{
src:url（'file:///Users/trusktr/src/my-project/node_modules/my-lib/dist/assets/fonts/AvenirNext/AvenirNext-DemiBold.eot'),
url（'file:///Users/trusktr/src/my-project/node_modules/my-lib/dist/assets/fonts/AvenirNext/AvenirNext-DemiBold.woff“）格式（“woff”），
url（'file:///Users/trusktr/src/my-project/node_modules/my-lib/dist/assets/fonts/AvenirNext/AvenirNext-DemiBold.svg“）格式（“svg”），
url（'file:///Users/trusktr/src/my-project/node_modules/my-lib/dist/assets/fonts/AvenirNext/AvenirNext-DemiBold.truetype格式（'truetype'）；
字体系列：AvenirNext；
字体风格：普通；
}

您是真正在本地（从

文件：//

URL）还是通过本地服务器（从

URL）查看HTML文件https://localhost:port

或类似内容）@Draconis全部在本地，来自

文件：//

。我用的是Electron，没有服务器在运行。你能试试相对路径吗@柯南弄明白了，贴出了答案。