I am unable to upgrade my old vite React project with Tailwind CSS v3 to Tailwind CSS v4 by using the below command:
npx @tailwindcss/upgrade@next
The terminal output screenshot:
At first I was using the command:
npx @tailwindcss/upgrade@next
but it was showing something related to git cache clear warn message. That's a different thing; thats why I have used --force after the command:
npx @tailwindcss/upgrade@next --force
Also, it was running without --force itself.
But the problem is that it's showing the error:
↳ Could not load the configuration file: Can't resolve
as per the above screenshot.
I will really appreciate it if anyone can help me regarding this issue, as I am unable to convert all of my old tailwind css react vite projects.
This is a known bug in the Tailwind upgrade tool (original bug report):
[…] fixes an issue where the upgrade tool would not be able to load some JavaScript config files across different drive letters on Windows.
The issue in detail is that
path.relative(…)tries to build a relative path but if the file is inside the same folder, it won't start the relative path with a./so we manually appended it in case that it isn't there. The issue on Windows specifically is thatfile.relative(…)can also return a legit absolute path, e.g. when the file is on a different drive. In this case we obviously don't want to prefix a path with./.
Work is in progress at https://github.com/tailwindlabs/tailwindcss/pull/15927. Once this PR has been merged into the Tailwind project, it should work for you.
As a work-around until then, you could consider running the upgrade tool in Windows Subsystem for Linux.
