mdbook-tailor

这是一个 mdbook 的预处理器。

在下一个重大版本之前我们计划多花一些时间 🐣

🔺它包含了一些在 问题 中提到的问题。

目的

使用此预处理器可以消除 PageSpeed Insights 中的以下警告。

显式设置图像元素的宽度和高度将减少布局偏差并提高 CLS。

相应的图像文件

该项目可以处理的图像文件取决于 Imaging 库。

图像处理库

它支持 PNG、JPEG、GIF、WebP 等通常在网页中使用的格式 😉

🔺目前不支持 AVIF。

安装

1. 使用 cargo 安装。

cargo install mdbook-tailor

2. 将以下内容添加到 book.toml 中。

[preprocessor.tailor]

用法

1. 使用 markdown 标记法，如常。

![example](example.webp)

2. 像平常一样进行 mdbook 构建。

mdbook build

以上步骤生成的 HTML 应包含由 mdbook-tailor 测量的图像大小。此外，还会添加延迟加载设置！

<img src="example.webp" alt="example" width="789" height="456" loading="lazy">

示例

这实际上是我自己制作的网站 ☺️

• GitHub Pages https://coralpink.github.io/commentary
• GitHub https://github.com/CoralPink/commentary

许可

在以下任一项许可下发布：

• Apache 许可证 2.0（《LICENSE-APACHE》或 https://apache.ac.cn/licenses/LICENSE-2.0）
• MIT 许可证（《LICENSE-MIT》或 http://opensource.org/licenses/MIT）

任选其一。

贡献

除非您明确说明，否则根据Apache-2.0许可证定义的，您有意提交以包含在作品中的任何贡献，应如上所述双重授权，没有任何附加条款或条件。