vite-nginx-stale-cache-debug

Your Vite React app shows stale content because Nginx serves outdated JavaScript files with immutable cache headers. Vite's default query param-based cache busting fails to force Nginx to fetch newly rebuilt files.

To fix stale cache issues, configure Vite to add content hashes to output filenames or temporarily disable Nginx immutable caching headers. This ensures Nginx correctly serves fresh files after a rebuild.

Diagnose stale cache by checking dist file modification times, HTTP cache headers like ETag and Cache-Control, and verifying whether file content matches your latest Vite React code changes.

Vite's default query param-based cache busting does not work well with Nginx immutable cache headers. Nginx may still serve stale files, requiring Vite configuration adjustments to add content hashes to filenames.

The best permanent fix is configuring Vite to add content hashes to output filenames. This makes Nginx's immutable caching work correctly without serving stale files during future deployments.

To quickly force fresh file serving during urgent deployments, temporarily disable Nginx's immutable caching headers. This forces Nginx to bypass stale cache and fetch the latest Vite React files.