vue.js 在< link>Nuxt.js应用程序中使用标签预加载字体

xzv2uavs 于 2023-08-07 发布在 Vue.js

关注(0)|答案(1)|浏览(187)

为了预加载字体，我尝试在Nuxt 2.15中向我的app.html文件添加<link>标签。问题是我不知道如何访问我的/assets/fonts文件夹。

<!DOCTYPE html>
<html {{ HTML_ATTRS }}>
  <head {{ HEAD_ATTRS }}>
    {{ HEAD }}
    <link rel="preload" href="~/assets/fonts/SoDoSans-Regular.woff" as="font" type="font/woff" crossorigin>
  </head>
  <body {{ BODY_ATTRS }}>
    {{ APP }}
  </body>
</html>

字符串
如何从app.html中访问/assets/文件夹？这给了我404错误，因为localhost:xxxx/~/assets/fonts/文件夹不存在。我试过使用require()，但它也不起作用。它只是将其作为字符串的一部分添加。
我看到this solution建议修改nuxt.config.js，但我需要使用app.html中的<link>标记来修改

vue.js

来源：https://stackoverflow.com/questions/75597368/preloading-fonts-with-link-tag-in-nuxt-js-app