Adobe Granite HTML 库管理器

Question

在 Adobe Granite HTML 库管理器中，“最大数据 uri 大小”如何工作？我在 configuration.But 中尝试了一个数据量很大的图像，但没有改变。谁能告诉我此配置在 AEM 中的工作原理？

Answer 1

css 文件的缩小可以自动内联小资源（例如图标）。配置参数 htmllibmanager.maxDataUriSize 控制要自动内联的资源的最大大小。

这是一个例子css:

#tiny-icon {
    height: 32px;
    width: 32px;
    background-image: url("tiny-icon.gif");
}

我的示例图标大小为 360 字节。如果 maxDataUriSize <= 360，缩小后的 css 文件将看起来：

#tiny-icon{height:32px;width:32px;background-image:url("test-alex/tiny-icon.gif")}

如果 maxDataUriSize > 360，图标将自动内联为数据-url:

#tiny-icon{height:32px;width:32px;background-image:url("data:image/gif;base64,R0lGODlhIAAgAIQQAEeczSqmzligoGmarl6khnCdy3CpaBjo9Gbuk4HxcbLf1Gb35tnhhtna19T2NO/w7////////////////////////////////////////////////////////////////yH5BAEKABAALAAAAAAgACAAAAXlYCGOZCkOhBGsgOm+I6qycF3Ka9DaPErkO17NBxSSHshHY8lwOA6LhWJJpdaS1OYzOq1Wr0qmEyr1Vh/XrCNB7pobyJqazX0vk/JGk162J9EwemttdnB/NXuEfn+ALgKDdYuMLwIGfG5mjHgjAiKVBIpvmpsFlaUGBACRoqNKnqifAAF9rJpWsaiyAZherVWxAQK6BYW+WbksKyKSjFVNqcrKy5mjzmvDBTojvcZibNIm3LZzUAGBd92CCGR5rWFi61xy7tbxC0tGLwOVwuD5JvsM9DP3z0XAgQUN8sOWkMRBhjBCAAA7")}

如果您想自己测试，请注意客户端库已缓存。删除 /var/clientlibs 中的缓存，或更新 css 文件。否则配置更改将无效，因为您仍然会看到 clientlib 的缓存版本。

Adobe Granite HTML 库管理器

Adobe Granite HTML Library Manager

aem