search

zeon-studio / hugoplate

Hugoplate is a free starter template built with Hugo and TailwindCSS that will save you hours of work.
https://zeon.studio/preview?project=hugoplate
MIT License
805 stars 219 forks source link

How to add a new css file #54

Closed marcuswu closed 10 months ago

marcuswu commented 10 months ago

I thought I had it figured out -- I added a file to assets/css and it works with npm run dev.

When I run npm run test to check it in a production environment, the css file is no longer included.

What am I missing?

marcuswu commented 10 months ago

I forgot to note that I did add the css to hugo.toml in the [[params.plugins.css]] slice.

tfsomrat commented 10 months ago

hey @marcuswu, you need to import your CSS into main.scss file, otherwise, it will not compile. thanks

marcuswu commented 10 months ago

Turns out, the problem was that the css in question isn't used until some js is run and the theme is set up to purge unused css in production. I needed to add some regex to the safelist in postcss.config.js

marcuswu commented 10 months ago

I really appreciate this theme and the work put into it and I also appreciate your willingness to help. This theme has been much nicer to use compared to the first one I tried. Except for a few situations like this where it feels like the magic of it works against me, I have enjoyed working with it. This theme would benefit from documenting the things that this theme adds to Hugo.