[2.2.0] laravel-mix spawning new build in a loop
Problem
What version of Tailwind CSS are you using? 2.2.1 What build tool (or framework if it abstracts the build tool) are you using? laravel-mix 6.0.23 What version of Node.js are you using? v16.3.0 What browser are you using? N/A What operating system are you using? macOS Reproduction repository `vinkla/tailwind-issue-4701` Describe your issue Installing the latest version 2.2.0 I'm having an issue with `laravel-mix` spawning a new build in a loop. https://user-images.githubusercontent.com/499192/122579390-25ce3280-d055-11eb-8533-40095e911fee.mp4 `webpack.mix.js` [code block] `tailwind.config.js` [code block]
Unverified for your environment
Select your OS to check compatibility.
1 Fix
Fix Laravel Mix Build Loop with Tailwind CSS 2.2.0
The issue arises from a combination of Tailwind CSS 2.2.0 and Laravel Mix 6.0.23, where the build process is triggered repeatedly due to file watching conflicts or misconfigurations in the webpack.mix.js or tailwind.config.js files.
Awaiting Verification
Be the first to verify this fix
- 1
Update Tailwind CSS
Upgrade Tailwind CSS to the latest stable version to ensure compatibility with Laravel Mix and resolve any known issues.
bashnpm install tailwindcss@latest - 2
Check Laravel Mix Configuration
Review the webpack.mix.js file for any misconfigurations that may cause the build loop. Ensure that the output paths and source maps are correctly set.
javascriptmix.js('resources/js/app.js', 'public/js').sass('resources/sass/app.scss', 'public/css'); - 3
Adjust Tailwind Configuration
Examine the tailwind.config.js file for any custom configurations that may lead to excessive rebuilds. Consider simplifying the configuration or removing unnecessary plugins.
javascriptmodule.exports = { purge: ['./resources/**/*.blade.php', './resources/**/*.js', './resources/**/*.vue'], theme: { extend: {}, }, variants: {}, plugins: [], }; - 4
Clear Cache
Clear the npm cache and Laravel Mix cache to eliminate any stale files that may be causing the build loop.
bashnpm cache clean --force && rm -rf node_modules/.cache - 5
Rebuild Assets
Run the build command again to check if the issue persists after making the above changes.
bashnpm run dev
Validation
The fix is successful if the build process completes without entering a loop, and the assets are generated correctly without errors. Monitor the console output for any warnings or errors during the build.
Sign in to verify this fix
Environment
Submitted by
Alex Chen
2450 rep