我如何在 vue 和 vuetify 中插入本地项目中的字体？

Question

我试图从我的本地项目中添加一种字体到 vuetify 并将其设置为主字体，但它不起作用。这是我的项目：主文件夹 public 来源资产字体的我的字体 iranyekan.css 节点模块

这是我在 public

中的 index.html

<style>
      @font-face {
        font-family: "IranYekan";
        src: url("../assets/fonts/IranYekan/iranyekanwebregular.woff2") format("woff2"),
        url("../assets/fonts/IranYekan/iranyekanwebregular.ttf") format("ttf"),
        url("../assets/fonts/IranYekan/iranyekanwebregular.woff") format("woff");
      }
    </style>

但它不起作用。谢谢

Answer 1

尝试更改您的链接以使用：

@/assets/fonts/IranYekan/iranyekanwebregular.ttf
or ~/assets/fonts/IranYekan/iranyekanwebregular.ttf 
or ~@/assets/fonts/IranYekan/iranyekanwebregular.ttf

不知道你的项目怎么样，vue是用~或者@引用根目录的，你试试？

<style>
      @font-face {
        font-family: "IranYekan";
        src: url("~@/assets/fonts/IranYekan/iranyekanwebregular.woff2") format("woff2"),
        url("~@/assets/fonts/IranYekan/iranyekanwebregular.ttf") format("ttf"),
        url("~@/assets/fonts/IranYekan/iranyekanwebregular.woff") format("woff");
      }
    </style>

我如何在 vue 和 vuetify 中插入本地项目中的字体？

How can i insert a font from my local project in vue and vuetify?

fonts

vue.js

vuetify.js