I need help with prefixing in tailwind-merge

[sarvalabs-harshrastogi]

I need help regarding prefix it is not working as expected or am I doing it wrong?

import { twMerge as baseMerge, extendTailwindMerge } from "tailwind-merge";

const merge = extendTailwindMerge({
  prefix: "tw-",
});

console.log(baseMerge("w-1/2", "w-1/3")); // OUTPUT: "w-1/3"
console.log(merge("tw-w-1/2", "tw-w-1/3")); // OUTPUT: "tw-w-1/2 tw-w-1/3"

Ideally I'm expecting merge to give me output as tw-w-1/3. Can somebody help on this.

[dcastil]

Hey @sarvalabs-harshrastogi! 👋

You're probably using tailwind-merge v3 and Tailwind CSS v3, right? tailwind-merge v3 only works together with Tailwind CSS v4 which has a different prefix syntax (classes look like tw:w-1/3 instead of tw-w-1/3).

If you use Tailwind CSS v3, you need to use tailwind-merge v2.6.0 instead. Then your code will work as expected.

---

Related: #527