时间戳

首页 > 解决方案 > 链接 sass 在 AEM 中编译 css 文件

aem - 链接 sass 在 AEM 中编译 css 文件

问题描述

嗨，我是 AEM 的新手，正在做一个前端样式的项目。我设法创建了一个包含我的 scss 文件的 SASS 文件夹 - 更新了 pom 文件以将其编译为 css 文件夹中的 css。但我不知道如何将我新创建的 css 文件链接到项目？

标签： aem

解决方案

创建一个 clientlib 并在其中包含您的 css 文件。这个新创建的 clientlib 应该包含在基本页面 html/jsp 或组件级别。

要为您的项目创建客户端库，请遵循以下 URL。 https://docs.adobe.com/content/help/en/experience-manager-65/developing/introduction/clientlibs.html

要将此 clientlib 包含在您的组件/基本页面中，请使用以下代码片段。

<sly data-sly-use.clientLib="${'/libs/granite/sightly/templates/clientlib.html'}">
<!--for css+js -->
<sly data-sly-call="${clientLib.all @ categories='your.clientlib'}</sly>
<!-- only js -->
<sly data-sly-call="${clientLib.js @ categories='your.clientlib'}" ></sly>
<!-- only css -->
<sly data-sly-call="${clientLib.css @ categories='your.clientlib'}" ></sly>

推荐阅读