TailwindCSS v3 upgrade gives very long compile times in NextJs Project with Docker

[timheerwagen]

Hi, since i upgraded Tailwind to v3 from v2 in my nextjs project the compile times in dev mode have increased from about 500 to 800ms to 9 to 15 seconds and it is no longer fun to work with it. The whole thing runs in a Docker container with webpackdevmiddleware.

I followed the upgrade instructions on the tailwind website.

Versions:

    node:14-alpine3.12
    "next": "^12.0.8",
    "@tailwindcss/forms": "^0.4.0",
    "autoprefixer": "^10.4.2",
    "postcss": "^8.4.5",
    "tailwindcss": "^3.0.15"

Compile messages:

  | event - compiled client and server successfully in 15.8s (775 modules)
  | wait  - compiling...
  | event - compiled successfully in 126 ms (532 modules)
  | wait  - compiling...
  | event - compiled successfully in 111 ms (243 modules)

next.config.js

module.exports = withPWA({
  pwa: {
    dest: "public",
    disable: process.env.NODE_ENV === "development",
  },
  reactStrictMode: true,
  poweredByHeader: false,
  
  webpackDevMiddleware: (config) => {
    config.watchOptions = {
      poll: 1000,
      aggregateTimeout: 300,
    };
    return config;
  },
});

Edit
Without Docker it works without problems. Is anything incompatible between the new tailwind engine and docker? As described above I use webpackdevmiddleware to enable hotmodulereload. I also tried commenting the tailwindcss plugin out inside the postcss.config.js and i was back at normal compile times.