tailwindcss icon indicating copy to clipboard operation
tailwindcss copied to clipboard

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

Open Bagmaz opened this issue 7 months ago • 1 comments

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"
  }
}

Bagmaz avatar Mar 27 '25 15:03 Bagmaz