Someone asked for this. It’s a very basic project, but it should be simple to set up. Please shout if it’s not.
It’s a GitHub template, but I assume it can also be used as a theme/module. Please shout if it cannot.
11 Likes
@bep, you are amazing!
thank you. i will give this a try!
1 Like
doctor @bep
i got it up and running, and it does load tailwind into the project as expected.
however it does not purge the CSS when running hugo with the production environment
hugo -e —production
the styles.css in public/css is 4.9mb
am i missing something?
The only difference between a template repo and a “normal” repo is that it can be forked without forking (using it as template). The normal links (for a module installation) hide left of the colorful button where one would look for the link 
The above does not do what you think it does.
If you just do:
hugo
That is production.
I checked the CSS on the Netlify build, and it’s 5.9KB (gzipped).
1 Like
You’re not actually forking as you don’t get the commit history of the original repo (a good thing).
1 Like
@bep Oh, wow. Incredible. Just confirmed that it is purging. I thought you needed to include the environment 
Thank you!
A quick summary for other people reading this:
hugo server=> developmenthugo=> production
hugo -e myenv=> myenv
1 Like
I adjusted the Purge config and got the CSS down to 1.6KB (compressed), which is fairly impressive considering it’s Tailwind.
Not much fat here:
2 Likes
The output size a function of the amount of Tailwind classes you use on the site, though? Your template is very lean so does not use a lot of classes. The lowest I got a production build on a functional site is around 5KB.
That and how aggressive you can/want to configure PurgeCSS. Since Hugo is using the output from the build to determine which classes/ids/elements used, we catch dynamic classes, Markdown etc. …
1 Like
Bep, I can confirm that it loads fine as a module.
[[module.imports]]
path = "github.com/bep/hugo-starter-tailwind-basic"
[build]
writeStats = true
I only got a warning when npm install : npm WARN postcss-reporter@7.0.0 requires a peer of postcss@^8.0.3 but none is installed. You must install peer dependencies yourself.
It was solve after googling with : npm install --save-dev postcss@^8.0.3.
For my test it doesn’t has any affect at the moment (I get the basic minify css), but it’s because i’m illiterate in the tailwind dept. That’s an other story, I’ll learn this :-).
{{- $css := resources.Get "/css/all.css" }}
{{- $css = $css | resources.PostCSS }}
<link href="{{ $css.RelPermalink }}" integrity="{{ $css.Data.Integrity }}" rel="stylesheet" type="text/css">
So your repo works fine for me as a module, even If I still have to use it successfully.
1 Like
The reason “why” this is coming up is that postcss tells you to install it globally. Then it’s never in the package.json of the projects and packages using postcss honor this “regulation”. It’s a space issue. I always install it explicitly in my package.json. It’s ok to have it a hundred times installed, if your hard drive is 1TB. Back when I was proud of my new 12GB hard drive it would have been another story.
1 Like
I have since added postcss as a dev dependency – I see why they do this, but their peer strategy is broken. They should like Hugo Modules (and Go modules) where you will have only 1 folder (for any given major version, I guess) floating around your disk.
1 Like
OK. Yippeee.
If I add your last commit (mode: 'all') it works !
content: ['./hugo_stats.json' ],
mode: 'all',
options: {
So I guess that using it as a module doesn’t get the latest code but the latest release.
This module is brillant Bep (as usual). Again thanks for all.
That is the default behaviour, yes.
1 Like
Ah, OK. Thanks. Really good to know that.
Because I only used proper Hugo Modules (with go.mod) and in this case the repo is updated with the latest code (and it is very very convenient).
Again thanks for your time & explanations.
As a side note, I noticed that you just upgraded the release to 0.6.0. Great.
But I still get the v0.5.0 whatever I do (fresh module install, hugo mod get -u, clean, tidy, maxAge = 0, … )
I do think it’s on my side, but just in case it is not …
I got it. It is 0.6.0 and not v0.6.0