mrmcc3 / tailwind-cljs-example

Example Setup - Tailwind + ClojureScript

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Example Setup - Tailwind + ClojureScript

Some example setups for using TailwindCSS with ClojureScript.

Both examples (figwheel-main, shadow-cljs) rely on the official tailwind nodejs tooling to process the CSS. All the official docs regarding configuration apply here.

The examples follow the tailwind recommendation for controlling css file size in production builds using PurgeCSS. One thing to be aware of is that by default PurgeCSS works by running a regex over all your source files to find anything that might be a CSS selector.

Out of the box it works on class names in cljs files that are strings or symbols. It does not work on keyword class names.

Due to the way PurgeCSS works it can only eliminate classes it can see via its regex. This means the tailwind classes need to be literal strings/symbols (not generated). See writing purgeable html

About

Example Setup - Tailwind + ClojureScript


Languages

Language:Clojure 59.0%Language:HTML 17.4%Language:Shell 11.9%Language:JavaScript 9.8%Language:CSS 2.0%