[v4.0.17] Infinite rebuild loop with vite build --watch, fixed in v4.0.6

[Bagmaz]

What version of Tailwind CSS are you using?

v4.0.17 (bug appears)
v4.0.6 (works correctly)

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

Vite 6.2.3

What version of Node.js are you using?

v23.10.0

What version of npm are you using?

10.9.2

What browser are you using?

Chrome

What operating system are you using?

macOS

---

Describe the bug

After upgrading to Tailwind CSS v4.0.17, running the following command causes an infinite rebuild loop:

vite build --watch

Reproduction steps

1. Install [email protected] and @tailwindcss/[email protected]
2. Run vite build --watch
3. Notice the build restarts over and over
4. Downgrade Tailwind CSS to v4.0.6
5. The issue disappears — builds only trigger on file changes as expected

vite.config.js

import {defineConfig} from "vite";
import tailwindcss from '@tailwindcss/vite';

export default defineConfig({
    plugins: [
        tailwindcss()
    ],
    build: {
        outDir: "./assets",
        emptyOutDir: false,
        minify: false,
        rollupOptions: {
            input: {
                app: "./resources/js/app.js",
                styles: "./resources/css/app.css",
            },
            output: {
                dir: "./assets",
                entryFileNames: "[name].js",
                chunkFileNames: "[name].js",
                assetFileNames: "[name].css",
            },
        },
    },
});

package.json

{
  "name": "vite-tailwind-alpine",
  "version": "1.0.0",
  "description": "A custom Shopify theme built with Dawn",
  "type": "module",
  "scripts": {
    "dev": "run-p -sr shopify:dev watch",
    "shopify:dev": "shopify theme dev -s my-project",
    "build": "vite build --minify",
    "watch": "vite build --watch"
  },
  "devDependencies": {
    "@tailwindcss/vite": "^4.0.6",
    "tailwindcss": "^4.0.6",
    "vite": "^6.2.3",
    "npm-run-all": "^4.1.5"
  },
  "dependencies": {
    "alpinejs": "^3.14.9",
    "gsap": "^3.12.7"
  }
}

[philipp-spiess]

Hey! Thanks, I was able to create a repro. The issue here is the name of the output directory (assets)—We have a heuristics to fix those for the default folder name (dist) but that heuristics does not apply in case of the renamed directory so it's considering it as a folder for your Tailwind source files.

The easiest way to fix this is to add assets to your .gitignore file as a workaround for now—or to change the source configuration to only look inside your source directories: https://tailwindcss.com/docs/detecting-classes-in-source-files#setting-your-base-path

Agree that this is somewhat unexpected though so I'll let this open while we figure out a way to guard against this!

Note for myself:

• Using insiders builds, @source not "…" also works around this issue
• This does require emptyOutDir to endless loop