tailwind 4 without preflight does not seem to work with webpack and postcss

[da1z]

What version of Tailwind CSS are you using?

4.0.12

What build tool (or framework if it abstracts the build tool) are you using?

webpack ,react, post css loader

What version of Node.js are you using?

lts

What browser are you using?

Arc

What operating system are you using?

macOS

Reproduction URL

I am sorry it is hard to create reproduction, but maybe you would know what issue right from description

Describe your issue

Basically the issue that main css is not being update when i add tailwind classes to classNames in dev watch mode if i import tailwind like this (i want to remove preflight but i keep it here for simplicity):

@layer theme, base, components, utilities;
@import "tailwindcss/theme.css" layer(theme);
@import "tailwindcss/preflight.css" layer(base);
@import "tailwindcss/utilities.css" layer(utilities);

but everything works, if import like:

@import "tailwindcss";

[da1z]

i am sorry. to be honest it stopped working either way :) maybe you can point at where to look at? my webpack config looks like this:

const { resolve } = require('path');
const MiniCssExtractPlugin = require('mini-css-extract-plugin');

module.exports = {
    configuration: {
        mode: 'development',

        module: {
            rules: [
                {
                    test: /\.css$/,
                    include: resolve(__dirname, 'src'),
                    use: [
                        MiniCssExtractPlugin.loader,
                        {
                            loader: 'css-loader',
                            options: {
                                importLoaders: 1,
                            },
                        },
                        {
                            loader: 'postcss-loader',
                            options: {
                                postcssOptions: {
                                    plugins: [require('@tailwindcss/postcss')],
                                },
                            },
                        },
                    ],
                },
                {
                    test: /\.css$/,
                    include: /node_modules/,
                    use: [MiniCssExtractPlugin.loader, 'css-loader'],
                },
            ],
        },
    },
};

[RobinMalfait]

Hey!

Really hard to tell from this information alone unfortunately. I would still recommend to try to create a minimal reproduction repo and attach it so we can take a look what's going on.

[da1z]

also these are my logs from tailwind postcss plugin. looks like this is called twice, can be this an issue?

[39.55ms] [@tailwindcss/postcss] src/app.css
[ 0.03ms]   ↳ Quick bail check
[27.51ms]   ↳ Setup compiler
[ 0.04ms]     ↳ PostCSS AST -> Tailwind CSS AST
[27.46ms]     ↳ Create compiler
[ 0.06ms]   ↳ Register full rebuild paths
[ 0.02ms]   ↳ Setup scanner
[ 4.34ms]   ↳ Scan for candidates
[ 4.64ms]   ↳ Register dependency messages
[ 2.11ms]   ↳ Build utilities
[ 0.48ms]   ↳ Transform Tailwind CSS AST into PostCSS AST
[ 0.21ms]   ↳ Update PostCSS AST
[0.69ms] [@tailwindcss/postcss] src/app.css
[0.00ms]   ↳ Quick bail check
[0.02ms]   ↳ Register full rebuild paths
[0.23ms]   ↳ Scan for candidates
[0.27ms]   ↳ Register dependency messages
[0.01ms]   ↳ Build utilities
[0.11ms]   ↳ Update PostCSS AST
2025-03-10 14:50:11: webpack compiled