NextJS 13 AppDir Tailwind Error | Next.js | Page 1

Module parse failed: Unexpected character '@' (1:0)
You may need an appropriate loader to handle this file type, currently no loaders are configured to process this file. See https://webpack.js.org/concepts#loaders
> @tailwind base;
| @tailwind components;
| @tailwind utilities;

Import trace for requested module:
./styles/globals.css``` did someone also had this error when switching to next 13 appDir? I tried to configure a Customer Loader but they doesnt really work well, also i think i dont even need a customer loader becouse i didnt needed one before . When i configure a Customer Loader other Errors occur like:  
```* ./node_modules/postcss-loader/dist/cjs.js
You may need an additional loader to handle the result of these loaders.
| */
|
> *,
| ::before,
| ::after {``` which doesnt make any sense to me

const withTM = require('next-transpile-modules')(['lord-icon-element']);
const ForkTsCheckerWebpackPlugin = require('fork-ts-checker-webpack-plugin')

module.exports = withTM({
  reactStrictMode: false,
  output: "standalone",
  experimental: {
    appDir: true,
  },
  webpack: (config, { isServer }) => {
    // Add a rule to handle CSS files
    config.module.rules.push({
      test: /\.css$/,
      use: [
        {
          loader: 'postcss-loader',
          options: {
            postcssOptions: {
              plugins: ['tailwindcss'],
            },
          },
        },
      ],
    })

    // Do not run type checking twice
    if (!isServer) {
      config.plugins.push(new ForkTsCheckerWebpackPlugin())
    }

    return config
  },
  images: {
    remotePatterns: [
      {
        protocol: "https",
        hostname: "**",
      },
    ],
  },

});

#NextJS 13 AppDir Tailwind Error