Hugo 的 resources 系统必须通过 assets/ 目录加载资源才能启用压缩、指纹、Sass 编译等构建能力；直接放 static/ 会丧失这些关键工程特性。
为什么直接放 static/ 不够用
直接把 CSS 放进 static/css/style.css 并用 <link rel="stylesheet" href="/css/style.css"> 引入，确实能跑通，但会错过 Hugo 的资源处理能力。比如无法自动压缩、不能加指纹（fingerprint）防缓存、没法合并多个文件、也不支持 Sass/Less 预处理。这些不是“锦上添花”，而是上线前必须解决的工程问题。
resources.Get 的基本链式调用怎么写
在模板中（如 layouts/partials/head.html）用 resources.Get 加载 CSS，并串联 resources.Minify 和 resources.Fingerprint：
{{ $css := resources.Get "css/main.css" | resources.Minify | resources.Fingerprint "sha256" }}
<link rel="stylesheet" href="{{ $css.Permalink }}" integrity="{{ $css.Data.Integrity }}">
关键点：
-
resources.Get只认assets/目录下的路径，不读static/ -
resources.Minify会压缩 CSS，去掉空格和注释；若源文件已是.min.css，它仍会再压一次（不一定更小） -
resources.Fingerprint在文件名后加哈希（如main.a1b2c3d4.css），并生成integrity值用于 Subresource Integrity 校验 - 必须用
$css.Permalink，不能用.RelPermalink—— 后者对资源无效
用 toCSS 处理 Sass 或 PostCSS
如果项目用 assets/css/main.scss，需先转成 CSS 才能 Minify：
立即学习“前端免费学习笔记（深入）”；
{{ $sass := resources.Get "css/main.scss" | resources.ToCSS | resources.Minify | resources.Fingerprint }}
<link rel="stylesheet" href="{{ $sass.Permalink }}">
注意：
-
resources.ToCSS默认调用内置 libsass，不支持 Dart Sass 新语法；如需 Dart Sass，得配hugo --enableGitInfo+ 外部二进制（较重） - PostCSS 需额外配置
postcss.config.js并启用postcss构建器，Hugo 0.110+ 才原生支持 -
toCSS不会自动加载@import的局部文件（如_variables.scss），必须确保所有依赖都在同一入口文件里@use或@import
合并多个 CSS 文件的常见错误
想把 base.css、components.css、pages.css 合并成一个请求？别用 append 拼字符串：
{{ $base := resources.Get "css/base.css" }}
{{ $comp := resources.Get "css/components.css" }}
{{ $all := slice $base $comp | resources.Concat "css/all.css" | resources.Minify | resources.Fingerprint }}
容易踩的坑：
-
resources.Concat要求所有输入都是resources.Resource类型，不能传 raw string 或readFile结果 - 合并顺序很重要：变量定义（
base）必须在前，否则组件里用不到$color-primary - 如果某文件不存在，
resources.Get返回nil，后续Concat会 panic —— 生产构建直接失败 - 合并后文件名（如
css/all.css）只是逻辑路径，最终输出名由Fingerprint决定，不是真实磁盘路径
真正难的不是写对这几行代码，而是让整个 assets 流程在本地开发、CI 构建、主题覆盖等不同场景下都稳定输出一致的哈希值 —— 这要求所有输入资源的路径、内容、甚至 Hugo 版本都保持确定性。
