hugo/content/en/hugo-pipes/introduction.md
Bjørn Erik Pedersen 77b976dd92 Squashed 'docs/' changes from a7e1e9be8..686c7b6eb
686c7b6eb ci(Netlify): specify `HUGO_VERSION` environment variable once
da99a356f fix: change heading level
e57da3f00 Update taxonomy methods
746172490 Update description of rendered breadcrumb navigation
6bc52fd40 Clarify term
dab07dcb0 Fix typo
e50fa452a Fix typo
6c1ea83c2 Update template overview page
a5dc97845 Clarify the append function
a135e52a0 Update GitHub hosting instructions
a51bf9f4f Update sections page
ed35fc6c4 Update archetypes and glossary
1a4522b3e Format examples
a70f20094 Use "hugo new content" to create content
673846ff9 Remove comment
b7febf0c5 Fix link
6f6fe2133 Miscellaneous edits
99227dd18 Remove lookup order table from output formats page
bc8870657 tools/editors: Add Prettier Plugin for Go Templates
157b169eb Update docs.yaml
1c8f514e0 Update cond function
e5f1f8113 Add assumptions to taxonomy and term template lookup order examples
475b406e2 Update postprocess
2d6cb8dfc glossary: Update content type
03b514bac Add descriptions to template lookup order example sections
06678f919 glossary: Fix broken link
4cd505612 Simplify news listing
fadb980db Update glossary of terms
491bacd78 Change order of example sections for template lookup order
04b8f39ec Create glossary of terms
12e896bc0 Remove reference to asciidoctor-rouge extension
055f7bb37 Insert missing words
8cd6ac387 Miscellaneous edits
2cbe17f41 Update configuration.md
529615373 Update data-templates.md
853154e65 Update theme
45f08627a resources.getRemote: Fix definition list
29a51dac1 Update docshelper
3bdfe88c6 Remove link to gitter from site footer
cacd0e461 Use "map" instead of "dictionary"
704dd5da6 Document the transform.Remarshal template function
e8d744951 Populate news section via GitHub releases API
3ff1118c7 Replace docs.json with docs.yaml
7726bbcac Use docs.json to generate default config throughout the site
57dca93df Use docs.json to generate default config for related content
74d5082c7 Add some .RenderShortcodes docs
cf5ab5062 netlify: Hugo 0.117.0
420f7aa69 Add all config to docshelper.json

git-subtree-dir: docs
git-subtree-split: 686c7b6eb182ed335dc94b3a0b80c564f7658380
2023-08-30 19:23:47 +02:00

183 lines
7.4 KiB
Markdown
Executable file

---
title: Hugo Pipes
linkTitle: Introduction
description: Hugo Pipes is Hugo's asset processing set of functions.
categories: [asset management]
keywords: []
menu:
docs:
parent: hugo-pipes
weight: 20
weight: 20
toc: true
aliases: [/assets/]
---
## Find resources in /assets
This is about the global Resources mounted inside `/assets`. For the `.Page` scoped Resources, see [Page Resources](/content-management/page-resources/).
Note that you can mount any directory into Hugo's virtual `assets` folder using the [Mount Configuration](/hugo-modules/configuration/#module-configuration-mounts).
| Function | Description |
| ------------- | ------------- |
| `resources.Get` | Get locates the file name given in Hugo's assets filesystem and creates a `Resource` object that can be used for further transformations. See [Get a resource](#get-a-resource). |
| `resources.GetRemote` | Same as `Get`, but it accepts remote URLs. See [Get a resource](#get-a-resource).|
| `resources.GetMatch` | `GetMatch` finds the first Resource matching the given pattern, or nil if none found. See Match for a more complete explanation about the rules used. |
| `resources.Match` | `Match` gets all resources matching the given base path prefix, e.g "*.png" will match all png files. The "*" does not match path delimiters (/), so if you organize your resources in sub-folders, you need to be explicit about it, e.g.: "images/*.png". To match any PNG image anywhere in the bundle you can do "\*\*.png", and to match all PNG images below the images folder, use "images/\*\*.jpg". The matching is case insensitive. Match matches by using the files name with path relative to the file system root with Unix style slashes (/) and no leading slash, e.g. "images/logo.png". See https://github.com/gobwas/glob for the full rules set.|
See the [GoDoc Page](https://pkg.go.dev/github.com/gohugoio/hugo/tpl/resources) for the `resources` package for an up to date overview of all template functions in this namespace.
## Get a resource
In order to process an asset with Hugo Pipes, it must be retrieved as a `Resource` using `resources.Get` or `resources.GetRemote`.
With `resources.Get`, the first argument is a local path relative to the `assets` directory/directories:
```go-html-template
{{ $local := resources.Get "sass/main.scss" }}
```
With `resources.GetRemote`, the first argument is a remote URL:
```go-html-template
{{ $remote := resources.GetRemote "https://www.example.com/styles.scss" }}
```
`resources.Get` and `resources.GetRemote` return `nil` if the resource is not found.
{{< new-in "0.110.0" >}} You can get information about the HTTP Response using `.Data` in the returned `Resource`. This is especially useful for HEAD request without any body. The Data object contains:
StatusCode
: The HTTP status code, e.g. 200
Status
: The HTTP status text, e.g. "200 OK"
TransferEncoding
: The transfer encoding, e.g. "chunked"
ContentLength
: The content length, e.g. 1234
ContentType
: The content type, e.g. "text/html"
### Caching
By default, Hugo calculates a cache key based on the `URL` and the `options` (e.g. headers) given.
{{< new-in "0.97.0" >}} You can override this by setting a `key` in the options map. This can be used to get more fine grained control over how often a remote resource is fetched, e.g.:
```go-html-template
{{ $cacheKey := print $url (now.Format "2006-01-02") }}
{{ $resource := resource.GetRemote $url (dict "key" $cacheKey) }}
```
### Error handling
The return value from `resources.GetRemote` includes an `.Err` method that will return an error if the call failed. If you want to just log any error as a `WARNING` you can use a construct similar to the one below.
```go-html-template
{{ with resources.GetRemote "https://gohugo.io/images/gohugoio-card-1.png" }}
{{ with .Err }}
{{ warnf "%s" . }}
{{ else }}
<img src="{{ .RelPermalink }}" width="{{ .Width }}" height="{{ .Height }}" alt="">
{{ end }}
{{ end }}
```
Note that if you do not handle `.Err` yourself, Hugo will fail the build the first time you start using the `Resource` object.
### Remote options
When fetching a remote `Resource`, `resources.GetRemote` takes an optional options map as the second argument, e.g.:
```go-html-template
{{ $resource := resources.GetRemote "https://example.org/api" (dict "headers" (dict "Authorization" "Bearer abcd")) }}
```
If you need multiple values for the same header key, use a slice:
```go-html-template
{{ $resource := resources.GetRemote "https://example.org/api" (dict "headers" (dict "X-List" (slice "a" "b" "c"))) }}
```
You can also change the request method and set the request body:
```go-html-template
{{ $postResponse := resources.GetRemote "https://example.org/api" (dict
"method" "post"
"body" `{"complete": true}`
"headers" (dict
"Content-Type" "application/json"
)
)}}
```
### Caching of remote resources
Remote resources fetched with `resources.GetRemote` will be cached on disk. See [Configure File Caches](/getting-started/configuration/#configure-file-caches) for details.
## Copy a resource
{{< new-in "0.100.0" >}}
Use `resources.Copy` to copy a page resource or a global resource. Commonly used to change a resource's published path, `resources.Copy` takes two arguments: the target path relative to the root of the `publishDir` (with or without a leading `/`), and the resource to copy.
```go-html-template
{{ with resources.Get "img/a.jpg" }}
{{ with .Resize "300x" }}
{{ with resources.Copy "img/a-new.jpg" . }}
<img src="{{ .RelPermalink }}" width="{{ .Width }}" height="{{ .Height }}" alt="">
{{ end }}
{{ end }}
{{ end }}
```
{{% note %}}
The target path must be different than the source path, as shown in the example above. See GitHub issue [#10412](https://github.com/gohugoio/hugo/issues/10412).
{{% /note %}}
## Asset directory
Asset files must be stored in the asset directory. This is `/assets` by default, but can be configured via the configuration file's `assetDir` key.
### Asset publishing
Hugo publishes assets to the `publishDir` (typically `public`) when you invoke `.Permalink`, `.RelPermalink`, or `.Publish`. You can use `.Content` to inline the asset.
## Go Pipes
For improved readability, the Hugo Pipes examples of this documentation will be written using [Go Pipes](/templates/introduction/#pipes):
```go-html-template
{{ $style := resources.Get "sass/main.scss" | resources.ToCSS | resources.Minify | resources.Fingerprint }}
<link rel="stylesheet" href="{{ $style.Permalink }}">
```
## Method aliases
Each Hugo Pipes `resources` transformation method uses a __camelCased__ alias (`toCSS` for `resources.ToCSS`).
Non-transformation methods deprived of such aliases are `resources.Get`, `resources.FromString`, `resources.ExecuteAsTemplate` and `resources.Concat`.
The example above can therefore also be written as follows:
```go-html-template
{{ $style := resources.Get "sass/main.scss" | toCSS | minify | fingerprint }}
<link rel="stylesheet" href="{{ $style.Permalink }}">
```
## Caching
Hugo Pipes invocations are cached based on the entire *pipe chain*.
An example of a pipe chain is:
```go-html-template
{{ $mainJs := resources.Get "js/main.js" | js.Build "main.js" | minify | fingerprint }}
```
The pipe chain is only invoked the first time it is encountered in a site build, and results are otherwise loaded from cache. As such, Hugo Pipes can be used in templates which are executed thousands or millions of times without negatively impacting the build performance.