Tailwind / React (NextJS) 添加自定义 CSS

Question

我有一个 next.js react 应用程序，我们正在使用 TailwindCSS，这太棒了。但是我需要添加我自己的自定义 css 标签，而且我似乎无法在编译时将它们加载到应用程序中。

我有一个“core.css”，它看起来像：

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

@layer base {
    *:not(i) {
        @apply font-sans;
    }
    p {
        @apply text-base mt-1 mb-1 pt-1 pb-1;
    }
    h1 {
        @apply text-xl;
    }
}

@layer utilities {
    .toggle-checkbox:checked {
        transition: all 0.5s ease-in-out;
        right: 0;
        border-color: #35c759;
    }
    .toggle-checkbox:checked + .toggle-label {
        background-color: #35c759;
        transition: all 0.5s ease-in-out;
    }
}

据我所知，这应该可以工作，但是在加载页面时，我在检查时找不到类定义。

任何帮助将不胜感激。