Tailwind and Vite
# help-with-umbraco
m
Not strictly an Umbraco question, but does anybody know how to set up tailwind in Vite? I'm following the Umbraco docs to create a new package. The Tailwind docs explain it in a very concise way. I.e. how does it know where the css is located? The issue in having is that no css is generated. I reckon Tailwind build doesn't run, as all the configuration to content files is correct.
d
Hi there! We use Vite and Tailwind for Umbraco, though not for package development. The way I understand it, is that you need to have a
postcss.config.cjs
file that exports a configuration with tailwind as a plugin. Apparently vite uses postcss internally and so it's automatically picked up from there
The tailwind config then specifies all the files that need to be checked for css classes
m
Thanks for the response. The 'trick' is that I need to include the css in the ts file that Vite compiles. That way the css is also compiled into a separate file. Yeah, probably a silly thing but I had on my head that the css was compiled independently to your js code.
I have seen a package that uses Gulp to compile the CSS instead, but I don't want to add another dependency if I don't need to.
d
ah yeah, I didn't think of that, but that's true, we also have a js file that imports the css
49 Views