Tailwind CSS v4 causing npm update conflicts

I’m having trouble with my project after installing Tailwind CSS version 4. Whenever I try to add an Angular Kendo module or run npm install, I get errors related to @angular-devkit/build-angular.

The error message mentions a conflict between Tailwind CSS v4 and the required peer dependency for @angular-devkit/build-angular. It seems that @angular-devkit/build-angular is looking for Tailwind CSS v2 or v3, but I have v4 installed.

I’ve tried using the --force and --legacy-peer-deps flags, but I’m still getting the same error. Does anyone have any suggestions on how to resolve this dependency conflict? Is there a way to make Tailwind CSS v4 work with the current version of @angular-devkit/build-angular?

Any help would be greatly appreciated. I’m stuck and not sure how to proceed with my project updates.

I’ve encountered this exact issue in a recent project. What worked for me was creating a custom resolution strategy in the package.json file. Add a ‘resolutions’ field like this:

"resolutions": {
  "tailwindcss": "^3.0.0"
}

Then run ‘npm install’ again. This forces npm to use Tailwind v3 for all dependencies, bypassing the conflict. It’s not a perfect solution, but it got my project running without major issues.

Another approach is to use yarn instead of npm as it has better dependency resolution capabilities and might handle the conflict more gracefully. Remember to keep an eye on updates from the Angular team, as support for Tailwind v4 will likely come in future releases of @angular-devkit/build-angular.

I have faced similar issues when upgrading to Tailwind CSS v4 alongside Angular. The dependency conflict arises because @angular-devkit/build-angular is not yet updated to support Tailwind CSS v4, and it expects v2 or v3. Switching to Tailwind CSS v3 may serve as an immediate workaround, which can be done by uninstalling v4 and installing v3 instead. Additionally, while using npm-force-resolutions might seem tempting to force compatibility, it could introduce further instability into your project.

hey bro, had the same issue. try downgrading tailwind to v3 for now. angular stuff is usually slow to update dependencies. or you could wait for @angular-devkit to catch up with tailwind v4, but who knows how long thatll take. good luck!