Infinite Loop Issue with Vite + Tailwind v4 + Shopify Development

[moxiethunder]

Hello everyone! I'm setting up a Shopify development environment using Vite and Tailwind v4 but encountering an infinite build loop issue.

Current Setup

• Using Vite to handle CSS/JS compilation
• Using Shopify CLI (shopify theme dev) to sync with Shopify
• Following Shopify's required folder structure
• Trying both Vite setup and PostCSS setup with Tailwind v4

The Issue

My workflow creates an infinite build loop:

1. Change a file (Liquid/CSS/JS)
2. vite build --watch compiles assets to /assets directory
3. Shopify CLI detects changes in /assets (a watched directory)
4. This triggers Tailwind to update
5. CSS files change, triggering Vite again
6. Return to step 2 → infinite loop

What Works

• Tailwind v3 with JS config works fine
• The issue appears specific to v4 and the CSS config

Suspected Cause

I believe the issue is related to how files are being built and the watch process interaction between Vite, Tailwind v4, and the Shopify CLI.

Has anyone encountered this issue or have suggestions for breaking this loop while maintaining the Vite + Tailwind v4 setup? Happy to provide more details if needed.