为什么我无法在我的 tailwind/react js 项目中运行本地字体？

Question

这是 Tailwind 的主要 CSS 文件：

@tailwind base;
@tailwind components;
@tailwind utilities;

#__next {
  min-height: 100%;
}

@font-face {
  font-family: 'notosans';
  src: local('notosans-semibold2'), local('notosans-semibold'),
    url('@/assets/fonts/notosans-semibold2.woff2');
  font-weight: 600;
}`

tailwind.config.js

文件中的代码

fontFamily: {
    sans: ['Inter', ...defaultTheme.fontFamily.sans],
    display: ['Lexend', ...defaultTheme.fontFamily.sans],
    notosans: ['notosans'],
},

这是字体所在的相对路径：

src/assets/fonts/notosans-semibold2.woff2

我尝试在本地导入的字体是从Google Fonts下载的

notosans-semibold2.woff2

。

Answer 1

您应该从

@

 中删除 

url('@/assets/...')

根据您的代码，这些文件似乎位于静态目录中。因此，您可以直接引用它们。