Tailwind CSS Latest Version – How to Upgrade? (Edited)

I have an old project created using Vite and React, where Tailwind CSS v3 is used for styling. In order to upgrade to Tailwind CSS v4, I ran the command:

		
npx @tailwindcss/upgrade@next --force

Initially, the command issued a warning related to the git cache, so I added the –force parameter. However, during execution, the following error appears:
During the first phase of running this command, I encountered a warning related to the git cache. To bypass this warning, I added the –force option. But then, during the upgrade process, the following error occurs:

		
Could not load the configuration file: Can't resolve

How can this problem be bypassed to successfully upgrade the project to Tailwind CSS v4? Maybe there is some kind of guide that describes the solution?

Zavulon Arias

3 months ago

6 answers

122 views

Rating

02
Answer

Answers

Tomaso Ruiz

Recently

1 comment

Rating

00

The latest version, tailwindcss v4.0.1, has been released.

The developer promised to fix the problem in a new version.

I think you can try upgrading your project.

Reply

    Zavulon Arias

    3 months ago

    1 comment

    Rating

    00

    I tried updating the product version, but without success. The issue started to look different:

    		
    ≈ tailwindcss v4.0.1 │ Searching for CSS files in the current directory and its subdirectories… │ ↳ Linked `.\tailwind.config.ts` to `.\src\xa_app\globals.css` │ Migrating JavaScript configuration files… │ ↳ Could not load the configuration file: v is not a function

    However, there was no positive result.

    Reply

      Tomaso Ruiz

      2 months ago

      1 comment

      Rating

      00

      It appears that yet another solution has surfaced here.

      The original post's author mentioned that they ran the following code:

      		
      bun i @tailwindcss/upgrade bun pm trust --all bun run upgrade

      This solved the path issue and eliminated the bug.

      Using Bun, the path problem during the upgrade is addressed by running commands to install the package and grant full trust (which is necessary for node-gyp to work correctly with the framework’s components).

      After the upgrade is done, the author recommends removing the update package by running:

      		
      bun rm @tailwindcss/upgrade

      Reply

        Zavulon Arias

        2 months ago

        Rating

        00

        Tomaso, thanks for your help with tailwind css.

        Reply

Marian Baker

3 months ago

Rating

00

If you are working on Windows, try upgrading the project through Windows Subsystem for Linux (WSL). That’s exactly what worked for me.

I hope this is a temporary solution until the official bug fix is released.

Reply

Antoni Collins

3 months ago

Edited

Rating

00

I encountered a similar problem. It turned out that the bug in the upgrade tool is related to the handling of file paths on Windows. The function responsible for computing relative paths may fail to add the required prefix or may return an absolute path if the files are located on different drives. This results in the 'Can't resolve' error.

Try moving the entire project to a single drive if you are using multiple partitions.

Reply