- About Hugo
- Getting Started
- Hugo Modules
-
Content Management
- Content Management Overview
- Organization
- Page Bundles
- Content Formats
- Front Matter
- Build Options
- Page Resources
- Image Processing
- Shortcodes
- Related Content
- Sections
- Content Types
- Archetypes
- Taxonomies
- Summaries
- Links and Cross References
- URL Management
- Menus
- Static Files
- Table of Contents
- Comments
- Multilingual and i18n
- Syntax Highlighting
-
Templates
- Templates Overview
- Introduction
- Template Lookup Order
- Custom Output Formats
- Base Templates and Blocks
- List Page Templates
- Homepage Template
- Section Templates
- Taxonomy Templates
- Single Page Templates
- Content View Templates
- Data Templates
- Partial Templates
- Shortcode Templates
- Local File Templates
- 404 Page
- Menu Templates
- Pagination
- RSS Templates
- Sitemap Template
- Robots.txt
- Internal Templates
- Alternative Templating
- Template Debugging
-
Functions
- Functions Quick Reference
- .AddDate
- .Format
- .Get
- .GetPage
- .HasMenuCurrent
- .IsMenuCurrent
- .Param
- .Render
- .RenderString
- .Scratch
- .Unix
- absLangURL
- absURL
- after
- anchorize
- append
- apply
- base64
- chomp
- complement
- cond
- countrunes
- countwords
- dateFormat
- default
- delimit
- dict
- echoParam
- emojify
- eq
- errorf and warnf
- fileExists
- findRE
- first
- float
- ge
- getenv
- group
- gt
- hasPrefix
- highlight
- hmac
- htmlEscape
- htmlUnescape
- hugo
- humanize
- i18n
- Image Functions
- in
- index
- int
- intersect
- isset
- jsonify
- lang.Merge
- lang.NumFmt
- last
- le
- len
- lower
- lt
- markdownify
- Math
- md5
- merge
- ne
- now
- os.Stat
- partialCached
- path.Base
- path.Dir
- path.Ext
- path.Join
- path.Split
- plainify
- pluralize
- printf
- println
- querify
- range
- readDir
- readFile
- ref
- reflect.IsMap
- reflect.IsSlice
- relLangURL
- relref
- relURL
- replace
- replaceRE
- safeCSS
- safeHTML
- safeHTMLAttr
- safeJS
- safeURL
- seq
- sha
- shuffle
- singularize
- site
- slice
- slicestr
- sort
- split
- string
- strings.Count
- strings.HasSuffix
- strings.Repeat
- strings.RuneCount
- strings.TrimLeft
- strings.TrimPrefix
- strings.TrimRight
- strings.TrimSuffix
- substr
- symdiff
- templates.Exists
- time
- title
- transform.Unmarshal
- trim
- truncate
- union
- uniq
- upper
- urlize
- urls.Parse
- where
- with
- Variables
- Hugo Pipes
- CLI
- Troubleshooting
- Tools
- Hosting & Deployment
- Contribute
- Maintenance
PostProcess
Marking a resource with resources.PostProcess
delays any transformations to after the build, typically because one or more of the steps in the transformation chain depends on the result of the build (e.g. files in public
).
New in v0.69.0
A prime use case for this is CSS purging with PostCSS .
There are currently two limitations to this:
-
This only works in
*.html
templates (i.e. templates that produces HTML files). -
You cannot manipulate the values returned from the resource’s methods. E.g. the
upper
in this example will not work as expected:{{ $css := resources.Get "css/main.css" }} {{ $css = $css | resources.PostCSS | minify | fingerprint | resources.PostProcess }} {{ $css.RelPermalink | upper }}
CSS purging with PostCSS
The below configuration will write a hugo_stats.json
file to the project root as part of the build. If you’re only using this for the production build, you should consider placing it below
config/production
.
[build]
writeStats = true
const purgecss = require('@fullhuman/postcss-purgecss')({
content: [ './hugo_stats.json' ],
defaultExtractor: (content) => {
let els = JSON.parse(content).htmlElements;
return els.tags.concat(els.classes, els.ids);
}
});
module.exports = {
plugins: [
require('tailwindcss'),
require('autoprefixer'),
...(process.env.HUGO_ENVIRONMENT === 'production' ? [ purgecss ] : [])
]
};
Note that in the example above, the “CSS purge step” will only be applied to the production build. This means that you need to do something like this in your head template to build and include your CSS:
{{ $css := resources.Get "css/main.css" }}
{{ $css = $css | resources.PostCSS }}
{{ if hugo.IsProduction }}
{{ $css = $css | minify | fingerprint | resources.PostProcess }}
{{ end }}
<link href="{{ $css.RelPermalink }}" rel="stylesheet" />