enter image description here
大家好，我已经建立了一个简单的Nextjs项目，我尝试使用@apply processor，它显示了上面的错误。
我的package.json

{
  "name": "simon-bask-health-app",
  "version": "0.1.0",
  "private": true,
  "scripts": {
    "dev": "next dev",
    "build": "next build",
    "start": "next start",
    "lint": "next lint",
    "prepare": "husky install"
  },
  "dependencies": {
    "-": "^0.0.1",
    "@react-google-maps/api": "^2.19.2",
    "chart.js": "^4.4.0",
    "eslint-config-prettier": "^9.0.0",
    "eslint-plugin-prettier": "^5.0.0",
    "flowbite": "^1.8.1",
    "flowbite-react": "^0.6.4",
    "husky": "^8.0.3",
    "lint-staged": "^14.0.1",
    "next": "13.5.4",
    "path": "^0.12.7",
    "react": "^18",
    "react-chartjs-2": "^5.2.0",
    "react-dom": "^18",
    "save-dev": "^0.0.1-security"
  },
  "devDependencies": {
    "@types/node": "^20",
    "@types/react": "^18",
    "@types/react-dom": "^18",
    "autoprefixer": "^10",
    "eslint": "^8",
    "eslint-config-next": "13.5.4",
    "postcss": "^8.4.31",
    "prettier": "^3.0.3",
    "prettier-plugin-tailwindcss": "^0.5.5",
    "tailwindcss": "^3",
    "typescript": "^5"
  }
}

我的tailwind配置文件：

import type { Config } from "tailwindcss";

const config: Config = {
  content: [
    "./node_modules/flowbite-react/**/*.js",
    "./pages/**/*.{js,ts,jsx,tsx,mdx}",
    "./components/**/*.{js,ts,jsx,tsx,mdx}",
    "./app/**/*.{js,ts,jsx,tsx,mdx}",
  ],
  theme: {
    extend: {
      colors: {
        textColor: "#111",
      },
      fontFamily: {
        inter: ["var(--font-inter)"],
        sulphur: ["var(--font-sulphur-point)"],
        roboto: ["var(--font-roboto)"],
      },
      backgroundColor: {
        buttonBackgroundColor: "#404040",
        hoverButtonBackgroundColor: "#000",
      },
    },
  },
  plugins: [require("flowbite/plugin")],
};
export default config;

import type { Config } from "tailwindcss";

const config: Config = {
  content: [
    "./node_modules/flowbite-react/**/*.js",
    "./pages/**/*.{js,ts,jsx,tsx,mdx}",
    "./components/**/*.{js,ts,jsx,tsx,mdx}",
    "./app/**/*.{js,ts,jsx,tsx,mdx}",
  ],
  theme: {
    extend: {
      colors: {
        textColor: "#111",
      },
      fontFamily: {
        inter: ["var(--font-inter)"],
        sulphur: ["var(--font-sulphur-point)"],
        roboto: ["var(--font-roboto)"],
      },
      backgroundColor: {
        buttonBackgroundColor: "#404040",
        hoverButtonBackgroundColor: "#000",
      },
    },
  },
  plugins: [require("flowbite/plugin")],
};
export default config;

我的postcss配置文件

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

在我的global.css文件中，您可以看到@apply用于样式化h1元素

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

body {
  margin: 0;
}

button {
  cursor: pointer;
}

h1 {
  @apply text-sm;
}

@layer {
  //Classes to hide scroll bar
  .scrollbar-hide::-webkit-scrollbar {
    display: none;
  }

  .scrollbar-hide {
    -ms-overflow-style: none; /* IE and Edge */
    scrollbar-width: none; /* Firefox */
  }
}

请帮我弄清楚这一点。谢谢.
我尝试再次安装所有需要的软件包，但它不工作。