search

ianrodrigues / hugo-tailwind-journal

A minimalist journal template for Hugo.
MIT License
42 stars 10 forks source link

How to regenerate CSS files ? #4

Closed SR-G closed 3 years ago

SR-G commented 3 years ago

I don't know anything about TailwindCSS (and the documentation is quite overhelming and seems quite unclear / not beginner-friendly at all), and i need to change some things about the CSS, but have no idea what needs to be done in order to regenerate the CSS files ?! (some CSS entries - like many color ones - from TailwindCSS are not available anywhere in the generated CSS (maybe they have been purged / removed, i would say).

So does anyone knows the few steps to apply in order to change something in scss files and regenerate everything ? Thanks in advance for any pointers on this subject ...

SR-G commented 3 years ago

Auto-reply (but why is this CSS/node ecosystem so much unintuitive, i really wonder).

Update package.json with ""postcss-cli": "^=8.0"` (otherwise next steps will fail)

Install npm (pacman -S npm or whatever)

Install node packages npm install tailwindcss postcss

Run build task npm run build, which should update static/css/theme.css with content from scss/theme.scss and by purging everything related to tailwindcss, except what is actually used inside the various .html hugo templates under layouts/ (i.e., if some tailwind classes are not used inside the theme, they won't be in the resulting css).