nuxt.js - 无法使用 Nuxt/Tailwind 安装字体

Question

我申请了 this answer确切地说，但我的自定义字体类仍然不起作用:tailwind.config.js :

module.exports = {
  theme: {
    fontFamily: {
      "intro-regular": "intro-regular"
    },
    extend: {
      fontSize: {
        "10": "10px",
        "11": "11px"
      }
    }
  }
}

在 assets/scss/fonts.scss :

@font-face {
  font-family: 'intro-regular';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('../fonts/intro/Intro-Regular.otf') format('opentype');
}

这应该有效，但是当我尝试时 @apply intro-regular在我的应用程序中的任何地方，我都会收到此错误:

The intro-black class does not exist

有什么建议吗？
(我什至没有看到 DevTools 的网络选项卡中加载的字体:不管 Tailwind 我认为字体至少应该加载但它没有)
编辑:有关我的设置的更多信息
导入我的 main.scss在 nuxt.config.js :

css: [
  {
    src: '~/assets/scss/main.scss',
    lang: 'scss'
  }
],

而在 main.scss :

@import 'fonts';

为了安装 Nuxt/Tailwind，我遵循了 the docs信。但有时 Nuxt.js 就是这种情况，事情并没有像预期的那样发展， Nuxt没有创建任何 tailwind.css /assets 中的文件文件夹。

Answer 1

src: url('../fonts/intro/Intro-Regular.otf')应该:src: url('~/assets/fonts/intro/Intro-Regular.otf')