背景类和自定义主题在带有 React 的 Tailwind CSS 中不起作用

我目前正在使用 ReactJS、Typescript 和 TailwindCSS 开发一个项目，并且一切似乎都运行正常。关键是，所有 TailwindCSS 类都可以正常工作，除了背景类。bg-sky-500每当我使用类似or的类时bg-slate-500，颜色从不显示，背景保持原样。另外，我试图在里面设置一个自定义主题tailwindcss.config.json，但它也不起作用。以下是项目中使用的配置：

tsconfig.json

{
    "compilerOptions": {
        "target": "es5",
        "lib": ["dom", "dom.iterable", "esnext"],
        "allowJs": true,
        "skipLibCheck": true,
        "esModuleInterop": true,
        "allowSyntheticDefaultImports": true,
        "strict": true,
        "forceConsistentCasingInFileNames": true,
        "noFallthroughCasesInSwitch": true,
        "module": "esnext",
        "moduleResolution": "node",
        "resolveJsonModule": true,
        "isolatedModules": true,
        "noEmit": true,
        "jsx": "react-jsx",
        "baseUrl": "src",
        "noImplicitAny": true,
        "noUnusedLocals": true,
        "noUnusedParameters": true
    },
    "include": ["src"]
}

tailwind.config.ts

module.exports = {
    content: ["./src/**/*.{js,jsx,ts,tsx}", "./public/index.html"],
    purge: [],
    darkMode: false, // or 'media' or 'class'
    theme: {
        extend: {},
    },
    variants: {
        extend: {},
    },
    plugins: [],
}

postcss.config.ts

module.exports = {
    plugins: {
        tailwindcss: {},
        autoprefixer: {},
    },
}

main.ts

    const path = require("path");

    module.exports = {
       stories: ["../src/**/*.stories.mdx", "../src/**/*.stories.@(js|jsx|ts|tsx)"],
       addons: [
          "@storybook/addon-links",
          "@storybook/addon-essentials",
          "@storybook/addon-interactions",
          "@storybook/preset-create-react-app",
       ],
       framework: "@storybook/react",
       core: {
         builder: "@storybook/builder-webpack5",
       },
       webpackFinal: async (config) => {
       config.module.rules.push({
            test: /\,css&/,
            use: [
                    {
                       loader: "postcss-loader",
                       options: {
                            ident: "postcss",
                            plugins: [require("tailwindcss"), require("autoprefixer")],
                       },
                     },
                  ],
            include: path.resolve(__dirname, "../"),
            });
            return config;
          },
        };

preview.ts

    import "index.css";

    export const parameters = {
        actions: { argTypesRegex: "^on[A-Z].*" },
        controls: {
           matchers: {
              color: /(background|color)$/i,
              date: /Date$/,
           },
         },
     };

index.css

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

有人能帮忙吗？