Laravel Mix TailwindCSS一些本地字體沒有渲染，編譯的CSS中缺少類。

我按照教程將本地字體文件添加到TailwindCSS中，其中一種字體有效，而其他字體無效，

主CSS文件app.css中的代碼

/* Importing the fonts from the public/fonts directory, using @layer to add them */
@font-face {
    font-family: "JetBrainsMono-Regular";
    src: url(../fonts/JetBrainsMono-Regular.woff2) format("woff2");
}

@font-face {
    font-family: "JetBrainsMono-Medium";
    src: url(.../fonts/JetBrainsMono-Medium.woff2) format("woff2");
}

@font-face {
    font-family: "JetBrainsMono-MediumItalic";
    src: url(.../fonts/JetBrainsMono-MediumItalic.woff2) format("woff2");
}

@font-face {
    font-family: "JetBrainsMono-Bold";
    src: url(.../fonts/JetBrainsMono-Bold.woff2) format("woff2");
}

@font-face {
    font-family: "JetBrainsMono-Italic";
    src: url(.../fonts/JetBrainsMono-Italic.woff2) format("woff2");
}

@font-face {
    font-family: "JetBrainsMono-BoldItalic";
    src: url(.../fonts/JetBrainsMono-BoldItalic.woff2) format("woff2");
}

@font-face {
    font-family: "JetBrainsMono-ExtraBold";
    src: url(.../fonts/JetBrainsMono-ExtraBold.woff2) format("woff2");
}

@font-face {
    font-family: "JetBrainsMono-ExtraBold-Italic";
    src: url(.../fonts/JetBrainsMono-ExtraBold-Italic.woff2) format("woff2");
}

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

下面是tailwind.config.js中的代碼

const defaultTheme = require("tailwindcss/defaultTheme");

/** @type {import('tailwindcss').Config} */
module.exports = {
    content: [
        "./vendor/laravel/framework/src/Illuminate/Pagination/resources/views/*.blade.php",
        "./storage/framework/views/*.php",
        "./resources/views/**/*.blade.php",
    ],

    theme: {
        extend: {
            fontFamily: {
                mono: ["JetBrainsMono-Regular", "monospace"],
                medium: ["JetBrainsMono-Medium", "monospace"],
                bold: ["JetBrainsMono-Bold", "monospace"],
                italic: ["JetBrainsMono-Italic", "monospace"],
                boldItalic: ["JetBrainsMono-BoldItalic", "monospace"],
                extraBold: ["JetBrainsMono-ExtraBold", "monospace"],
                extraBoldItalic: ["JetBrainsMono-ExtraBoldItalic", "monospace"],
                mediumBold: ["JetBrainsMono-MediumItalic", "monospace"],
            },
        },
    },

    plugins: [require("@tailwindcss/forms")],
};

現在，編譯后的app.css只包含字體類

.font-bold {
    font-family: JetBrainsMono-Bold, monospace;
}
.font-medium {
    font-family: JetBrainsMono-Medium, monospace;
}
.font-mono {
    font-family: JetBrainsMono-Regular, monospace;
}

但是唯一有效的字體是常規(guī)字體，serif類是存在的，但是我沒有修改它，所以它沒有改變，但是有趣的是其他類都不見了。我在resources/fonts文件夾中有原始的字體文件，一個webpack mix正在將它們復制到public/fonts目錄中，這些文件也加載到編譯后的app.css中。

一點點幫助會很好，由于項目要求，也使用laravel v8.x。