First, thanks for creating this plugin! It's nearly 90% perfect for me. ✨
Why 90%:
className={cn(
fonts.Gilroy_Sans.variable,
fonts.Sf_Mono.variable,
"relative h-fit !scroll-smooth bg-mega-background",
e({
all: "focus:outline-none",
selection: "bg-zinc-400/40 text-mega-secondary text-shadow-none"
})
)}
I use cn() because although the results of fonts.Gilroy_Sans.variable and fonts.Sf_Mono.variable are "string" (see below), but in the TW transform time, it's a variable, so e() will be failed when parsing the object with those two (I mean just the object's styles was not created, the string and fonts are ok), when delete 2 font variables, it works like normal.
Infact, this is enough for me, but I want to try to ask if we can do something like:
import * as fonts from "@/app/fonts"
import { clsx as cn } from "clsx"
import { e } from "easy-tailwind"
function etwind(...args) {
const cnArgs = []
const eArgs = []
args.forEach(arg => {
if (typeof arg !== "string") {
eArgs.push(arg)
} else {
cnArgs.push(arg)
}
})
return cn(...cnArgs, e(...eArgs))
}
// then the biggest problem of this plugin may be solved
<html className={etwind(
fonts.Gilroy_Sans.variable, // this go to cn()
fonts.Sf_Mono.variable, // this go to cn()
"relative h-fit !scroll-smooth bg-mega-background", // this go to cn()
{ // but this go to e()
all: "opacity-50",
selection: "bg-zinc-400/40 text-mega-secondary text-shadow-none"
}
)}>
</html>
But, what e() scanned is ...eArgs; yes, actually the string ..eArgs, not the object. Although the result when I inspect <html /> seems right, no loss classes:
class="gilroy_sans_2a70e61c-module__96ixaa__variable sf_mono_e07e9971-module__91Mg3a__variable relative h-fit !scroll-smooth bg-mega-background all:opacity-50 selection:bg-zinc-400/40 selection:text-mega-secondary selection:text-shadow-none"
Of course the style from the object, which is all:* and selection:* are not applied
I'm using Nextjs 15 with --turbo, not Webpack but I think that's not the problem. Do you have any ideas or some possible thoughts? @Noriller
First, thanks for creating this plugin! It's nearly 90% perfect for me. ✨
Why 90%:
I use cn() because although the results of
fonts.Gilroy_Sans.variableandfonts.Sf_Mono.variableare "string" (see below), but in the TW transform time, it's a variable, so e() will be failed when parsing the object with those two (I mean just the object's styles was not created, the string and fonts are ok), when delete 2 font variables, it works like normal.Infact, this is enough for me, but I want to try to ask if we can do something like:
But, what e() scanned is
...eArgs; yes, actually the string..eArgs, not the object. Although the result when I inspect<html />seems right, no loss classes:Of course the style from the object, which is
all:*andselection:*are not appliedI'm using Nextjs 15 with --turbo, not Webpack but I think that's not the problem. Do you have any ideas or some possible thoughts? @Noriller