圖像處理
Hugo 提供在構建過程中轉換和分析圖像的方法。結果會被緩存以確保後續構建保持快速。
資源
要處理圖像，你必須將文件捕獲為頁面資源、全局資源或遠程資源。
頁面
page resource（頁面資源）�?page bundle（頁面捆綁包）內的文件�
content/
└── posts/
└── post-1/ <-- 頁面 bundle
├── index.md
└── sunset.jpg <-- 頁面資源要將圖像捕獲為頁面資源：
{{ $image := .Resources.Get "sunset.jpg" }}全局
global resource（全局資源）是 assets 目錄內或掛載�?assets 目錄的任何目錄中的文件�
assets/
└── images/
└── sunset.jpg <-- 全局資源要將圖像捕獲為全局資源：
{{ $image := resources.Get "images/sunset.jpg" }}遠程
remote resource（遠程資源）是通過 HTTP �?HTTPS 可訪問的遠程服務器上的文件�
要將圖像捕獲為遠程資源：
{{ $image := resources.GetRemote "https://www.hugodoc.com/img/hugo-logo.png" }}渲染
一旦你將圖像捕獲為資源，使用 Permalink、RelPermalink、Width 和 Height 方法在模板中渲染它。
示例 1：如果找不到資源則拋出錯誤。
{{ $image := .Resources.GetMatch "sunset.jpg" }}
<img src="{{ $image.RelPermalink }}" width="{{ $image.Width }}" height="{{ $image.Height }}">示例 2：如果找不到資源則跳過圖像渲染。
{{ $image := .Resources.GetMatch "sunset.jpg" }}
{{ with $image }}
<img src="{{ .RelPermalink }}" width="{{ .Width }}" height="{{ .Height }}">
{{ end }}示例 3：如果找不到資源則跳過圖像渲染的更簡潔方法。
{{ with .Resources.GetMatch "sunset.jpg" }}
<img src="{{ .RelPermalink }}" width="{{ .Width }}" height="{{ .Height }}">
{{ end }}示例 4：如果訪問遠程資源有問題則跳過渲染。
{{ $url := "https://www.hugodoc.com/img/hugo-logo.png" }}
{{ with try (resources.GetRemote $url) }}
{{ with .Err }}
{{ errorf "%s" . }}
{{ else with .Value }}
<img src="{{ .RelPermalink }}" width="{{ .Width }}" height="{{ .Height }}">
{{ else }}
{{ errorf "Unable to get remote resource %q" $url }}
{{ end }}
{{ end }}處理
要轉換圖像，對圖像資源應用處理方法。Hugo 按需生成處理後的圖像，緩存結果，並返回新的資源對象。
{{ with .Resources.Get "sunset.jpg" }}
{{ with .Resize "400x" }}
<img src="{{ .RelPermalink }}" width="{{ .Width }}" height="{{ .Height }}">
{{ end }}
{{ end }}在圖像轉換期間元數據不會保留。對 原始 圖像資源使用 Exif 或 Meta 方法從 JPEG、PNG、TIFF 和 WebP 圖像中提取元數據。
每種方法服務於特定的轉換或元數據需求：
| Method | Description |
|---|---|
Colors |
使用簡單直方圖方法返回最主導顏色的切片。 |
Crop |
返回根據給定處理規范裁剪的新圖像資源。 |
Exif |
適用於 JPEG、PNG、TIFF 和 WebP 圖像，返回包含 Exif 元數據的對象。 |
Fill |
返回根據給定處理規范裁剪和調整大小的新圖像資源。 |
Filter |
對一個或多個圖像濾鏡應用於給定圖像資源。 |
Fit |
返回根據給定處理規范縮小的新圖像資源。 |
Meta |
適用於 JPEG、PNG、TIFF 和 WebP 圖像，返回包含 Exif、IPTC 和 XMP 元數據的對象。 |
Process |
返回根據給定處理規范處理的新圖像資源。 |
Resize |
返回根據給定處理規范調整大小的新圖像資源。 |
從上面的表中選擇方法以獲取語法和使用示例。
性能
緩存
Hugo 按需處理圖像並返回新的資源對象。為確保後續構建保持快速，Hugo 將結果緩存在站點配置的 [file cache] 部分指定的目錄中。
如果你使用 Netlify 托管站點，在站點配置中包含以下內容以在構建之間持久化圖像緩存：
[caches]
[caches.images]
dir = ':cacheDir/images'垃圾回收
如果你更改圖像處理方法，或重命名/刪除圖像，緩存最終將包含未使用的文件。要刪除它們並回收磁盤空間，運行 Hugo 的垃圾回收：
hugo --gc資源使用
處理圖像所需的時間和內存隨圖像的尺寸增加而增加。例如，4032x2268 圖像比 1920x1080 圖像需要更多的內存和處理時間。
如果你的源圖像比你打算發布的最大尺寸大得多，考慮在構建之前縮小它們以優化性能。
配置
請參閱 configure imaging。