0

I'm following the Vite plugin documentation, but I'm running into an error because of the new Vite 7.

I'm creating a new project generated with the new 7.x latest version, then running it:

npm install tailwindcss @tailwindcss/vite

Found: [email protected]
node_modules/vite
  dev vite@"^7.0.0" from the root project

Could not resolve dependency:
peer vite@"^5.2.0 || ^6" from @tailwindcss/[email protected]
node_modules/@tailwindcss/vite
  @tailwindcss/vite@"*" from the root project

How can I still use it with Vite 7 and the @tailwindcss/vite plugin?

Improve this question

1 Answer 1

Reset to default
2

Vite 6

Basically, I recommend waiting for official support, and in the meantime, create your project with Vite 6. Vite 7 has only been out for a day.

npm create vite@6

Vite Latest

But even with npm create vite@latest, it's possible to override the TailwindCSS Vite plugin's requirements. Add this to the end of your package.json file:

{
  "dependencies": {
    "vite": "^7",
    "tailwindcss": "^4",
    "@tailwindcss/vite": "^4"
  },
  "overrides": {
    "@tailwindcss/vite": {
      "vite": "^7.0.0"
    }
  }
}

Then install it:

npm install
Improve this answer
Sign up to request clarification or add additional context in comments.

2 Comments

Done. It'll be included in the next release. So the answer is that support goes up to v4.1.10 - starting from v4.1.11 and above, Vite 7 is already supported. github.com/tailwindlabs/tailwindcss/pull/18384
v4.1.11 was released with Vite 7 support.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.