assets

Assets

静态资源处理：SCSS 编译、合并、压缩、图片缩放。

 1hooks:
 2  assets:
 3    enabled: true
 4    option:
 5      css:
 6        files:
 7          - "scss/style.scss"
 8          - "css/custom.css"
 9        sass_compiler: "dartsass"
10        filters:
11          - "cssmin"
12        output: "static/style.min.css"
13      js:
14        files:
15          - "js/main.js"
16          - "js/theme.js"
17        filters:
18          - "jsmin"
19        output: "static/script.min.js"
20      cover:
21        files:
22          - "images/cover.jpg"
23        filters:
24          - name: "image"
25            width: 1200
26            height: 800
27            fit: "inside"
28            quality: 82
29        output: "static/cover.jpg"

.scss/.sass 文件自动编译为 CSS。默认使用 libscss；配置 sass_compiler: "dartsass" 时改用 Dart Sass Embedded，需要本机可执行文件 sass 在 PATH 中可用，并支持 sass --embedded。

cssmin、jsmin 用于合并后的文本资源处理，不接受参数。image 用于单个图片文件，支持 width、height、fit、quality 参数；fit 可选 inside、cover、fill，默认 inside；quality 仅用于 JPEG，范围 1..100，默认 85。图片输出格式由 output 扩展名决定，支持 .jpg、.jpeg、.png、.gif；GIF 会按静态图处理，不保留动画。

使用 image filter 时，files 的 glob 最终必须只匹配一个图片文件，不会执行文本合并。模板内联 assets 标签只支持字符串形式的 filters，带参数的图片处理建议写在配置中。

配置校验会在插件初始化时执行：缺少 files、缺少 output、使用未知 filters 或非法 filter 参数都会使构建失败。

模板：

1{% assets css %}
2<link rel="stylesheet" href="{{ config.base_url }}/{{ asset_url }}">
3{% endassets %}