Verwendung clientseitiger Bibliotheken

Moderne Websites beruhen in hohem Maße auf der clientseitigen Verarbeitung durch einen komplexen JavaScript- und CSS-Code. Die Organisation und Optimierung der Bereitstellung dieses Codes kann äußerst kompliziert sein.

Um Abhilfe zu schaffen, stellt AEM clientseitige Bibliotheksordner zur Verfügung, mit denen Sie Ihren clientseitigen Code im Repository speichern, in Kategorien gruppieren und definieren können, wann und wie jede Codekategorie dem Client bereitgestellt werden soll. Das clientseitige Bibliotheksystem übernimmt dann das Erstellen der korrekten Links in der endgültigen Webseite, um den korrekten Code zu laden.

Funktionsweise clientseitiger Bibliotheken in AEM

The standard way to include a client-side library (that is, a JS or CSS file) in the HTML of a page is simply to include a <script> or <link> tag in the JSP for that page, containing the path to the file in question. Beispiel:

...
<head>
   ...
   <script type="text/javascript" src="/etc/clientlibs/granite/jquery/source/1.8.1/jquery-1.8.1.js"></script>
   ...
</head>
...

Obwohl diese Vorgehensweise in AEM funktioniert, kann sie zu Problemen führen, wenn die Seiten und die darin enthaltenen Komponenten zu komplex werden. Dann besteht die Gefahr, dass mehrere Kopien derselben JS-Bibliothek in der endgültigen HTML-Ausgabe enthalten sind. Um dies zu vermeiden und einen logischen Aufbau clientseitiger Bibliotheken zu ermöglichen, verwendet AEM clientseitige Bibliotheksordner.

Ein clientseitiger Bibliotheksordner ist ein Repository-Knoten des Typs cq:ClientLibraryFolder. Seine Definition in CND-Notation ist

[cq:ClientLibraryFolder] > sling:Folder
  - dependencies (string) multiple
  - categories (string) multiple
  - embed (string) multiple
  - channels (string) multiple

By default, cq:ClientLibraryFolder nodes can be placed anywhere within the /apps, /libs and /etc subtrees of the repository (these defaults, and other settings can be controlled through the Adobe Granite HTML Library Manager panel of the System Console).

Each cq:ClientLibraryFolder is populated with a set of JS and/or CSS files, along with a few supporting files (see below). The properties of the cq:ClientLibraryFolder are configured as follows:

  • categories: Identifiziert die Kategorien, in die der Satz der JS- und/oder CSS-Dateien in diesem cq:ClientLibraryFolder Herbst fällt. Da die Eigenschaft categories mehrere Werte aufweisen kann, kann ein Bibliotheksordner zu mehreren Kategorien gehören (weiter unten sehen Sie, warum dies nützlich sein kann).

  • dependencies: Eine Liste anderer Client-Bibliothekskategorien, von denen dieser Bibliotheksordner abhängt. For example, given two cq:ClientLibraryFolder nodes F and G, if a file in F requires another file in G in order to function properly, then at least one of the categories of G should be among the dependencies of F.

  • embed: Wird zum Einbetten von Code aus anderen Bibliotheken verwendet. Wenn Node F die Knoten G und H einbettet, ist das resultierende HTML eine Inhaltskonzentration der Knoten G und H.

  • allowProxy: Wenn sich eine Client-Bibliothek unter /appsbefindet, erlaubt diese Eigenschaft den Zugriff darauf über das Proxy-Servlet. See Locating a Client Library Folder and Using the Proxy Client Libraries Servlet below.

Referenzieren von clientseitigen Bibliotheken

Da HTL die bevorzugte Technologie zur Entwicklung von AEM Sites ist, sollte HTL verwendet werden, um clientseitige Bibliotheken in AEM einzuschließen. Sie können jedoch auch JSP verwenden.

Verwendung von HTL

In HTL werden Client-Bibliotheken über eine durch AEM bereitgestellte Hilfsvorlage geladen, auf die über data-sly-use zugegriffen werden kann. In dieser Datei sind drei Vorlagen verfügbar, die über data-sly-call abgerufen werden können:

  • css - Lädt nur die CSS-Dateien der referenzierten Client-Bibliotheken.
  • js - Lädt nur die JavaScript-Dateien der referenzierten Clientbibliotheken.
  • all - Lädt alle Dateien der referenzierten Client-Bibliotheken (sowohl CSS als auch JavaScript).

Jede Hilfsvorlage erwartet eine categories-Option für das Referenzieren der gewünschten Client-Bibliotheken. Bei dieser Option kann es sich um einen Zeichenfolgenwertbereich handeln oder um eine Zeichenfolge, die eine CSV-Liste enthält.

For further details and exmple of usage, see the document Getting Started with the HTML Template Language.

Verwendung von JSP

Add a ui:includeClientLib tag to your JSP code to add a link to client libraries in the generated HTML page. To reference the libraries, you use the value of the categories property of the ui:includeClientLib node.

<%@taglib prefix="ui" uri="https://www.adobe.com/taglibs/granite/ui/1.0" %>
<ui:includeClientLib categories="<%= categories %>" />

For example, the /etc/clientlibs/foundation/jquery node is of type cq:ClientLibraryFolder with a categories property of value cq.jquery. Der folgende Code in einer JSP-Datei referenziert die Bibliotheken:

<ui:includeClientLib categories="cq.jquery"/>

Die generierte HTML-Seite enthält den folgenden Code:

<script type="text/javascript" src="/etc/clientlibs/foundation/jquery.js"></script>

Ausführliche Informationen wie Attribute zum Filtern von JS, CSS oder Themenbibliotheken finden Sie unter ui:includeClientLib.

ACHTUNG

<cq:includeClientLib>, die in der Vergangenheit häufig zur Einbindung von Client-Bibliotheken verwendet wurde, ist seit AEM 5.6 veraltet. <ui:includeClientLib> sollte stattdessen wie oben beschrieben verwendet werden.

Erstellen von Client-Bibliotheksordnern

Erstellen Sie einen cq:ClientLibraryFolder-Knoten, um JavaScript- und CSS-Bibliotheken zu definieren und HTML-Seiten zur Verfügung zu stellen. Verwenden Sie die categories-Eigenschaft des Knotens, um festzulegen, zu welchen Bibliothekskategorien er gehört.

Der Knoten enthält eine oder mehrere Quelldateien, die zur Laufzeit zu einer einzelnen JS- und/oder CSS-Datei zusammengeführt werden. The name of the generated file is the node name with either the .js or .css file name extension. For example, the library node named cq.jquery results in the generated file named cq.jquery.js or cq.jquery.css.

Client-Bibliotheksordner enthalten die folgenden Elemente:

  • Die zusammenzuführenden JS- und/oder CSS-Quelldateien.

  • Ressourcen, die CSS-Styles unterstützen, z. B. Bilddateien.

    Hinweis: Sie können Quelldateien mit Unterordnern organisieren.

  • Eine Datei js.txt und/oder css.txt, die die Quelldateien angibt, die in die generierten JS- und/oder CSS Dateien zusammengeführt werden sollen.

clientlibarch

Weitere Informationen zu Anforderungen speziell für Client-Bibliotheken für Widgets finden Sie unter Verwendung und Erweiterung von Widgets.

Der Webclient benötigt eine Zugriffsberechtigung auf den Knoten cq:ClientLibraryFolder. Sie können auch Bibliotheken aus geschützten Bereichen des Repositorys bereitstellen (siehe „Einbetten von Code aus anderen Bibliotheken“ unten).

Überschreiben von Bibliotheken in /lib

Client library folders located below /apps take precedence over same-named folders that are similarly located in /libs. Zum Beispiel /apps/cq/ui/widgets hat Vorrang vor /libs/cq/ui/widgets. When these libraries belong to the same category, the library below /apps is used.

Finden eines Client-Bibliotheksordners und Verwendung des Proxy-Servlets für Client-Bibliotheken

In previous versions, client library folders were located below /etc/clientlibs in the repository. This is still supported, however it is recommended that client libraries now be located under /apps. This is to locate the client libraries near the other scripts, which are generally found below /apps and /libs.

Hinweis

Statische Ressourcen unter dem Clientbibliotheksordner müssen sich in einem Ordner mit dem Namen resources befinden. Wenn Sie nicht über die statischen Ressourcen, wie z. B. Bilder, in den Ordnerressourcen verfügen, kann auf diese nicht in einer Veröffentlichungsinstanz verwiesen werden. Hier ein Beispiel: http://localhost:4503/etc.clientlibs/geometrixx/components/clientlibs/resources/example.gif

Hinweis

In order to better isolate code from content and configuration, it is recommended to locate client libraries under /apps and expose them via /etc.clientlibs by leveraging the allowProxy property.

In order for the client libraries under /apps to be accessible, a proxy servelt is used. The ACLs are still enforced on the client library folder, but the servlet allows for the content to be read via /etc.clientlibs/ if the allowProxy property is set to true.

Eine statische Ressource kann nur über den Proxy abgerufen werden, wenn sie sich unter einer Ressource unter dem Client-Bibliotheksordner befindet.

Beispiel:

  • You have a clientlib in /apps/myproject/clientlibs/foo
  • You have a static image in /apps/myprojects/clientlibs/foo/resources/icon.png

Then you set the allowProxy property on foo to true.

  • You can then request /etc.clientlibs/myprojects/clientlibs/foo.js
  • You can then reference the image via /etc.clientlibs/myprojects/clientlibs/foo/resources/icon.png
ACHTUNG

Bei der Verwendung von Proxyclient-Bibliotheken erfordert die AEM Dispatcher-Konfiguration möglicherweise ein Update, um sicherzustellen, dass die URIs mit der Erweiterung clientlibs zulässig sind.

ACHTUNG

Adobe recommends locating client libraries under /apps and making them available using the proxy servlet. However keep in mind that best practice still requires that public sites never include anything that is served directly over an /apps or /libs path.

Erstellen eines Client-Bibliotheksordners

  1. Öffnen Sie CRXDE Lite in einem Webbrowser (http://localhost:4502/crx/de).

  2. Wählen Sie den Ordner aus, in dem Sie den Client-Bibliotheksordner platzieren möchten, und klicken Sie auf Erstellen > Knoten erstellen.

  3. Geben Sie einen Namen für die Bibliotheksdatei ein und wählen Sie in der Typenliste cq:ClientLibraryFolder aus. Klicken Sie auf OK und dann auf Alle speichern.

  4. Um die Kategorien festzulegen, zu denen die Bibliothek gehört, wählen Sie den Knoten cq:ClientLibraryFolder aus, fügen Sie die folgende Eigenschaft hinzu und klicken Sie auf Alle speichern:

    • Name: categories
    • Typ: String
    • Wert: Kategoriename
    • Multi: Auswählen
  5. Fügen Sie die Quelldateien auf beliebige Weise zum Bibliotheksordner hinzu. Sie können zum Beispiel einen WebDav-Client verwenden, um Dateien zu kopieren, oder eine Datei erstellen und den Inhalt manuell eingeben.

    Hinweis: Sie können Quelldateien bei Bedarf in Unterordnern organisieren.

  6. Wählen Sie den Client-Bibliotheksordner aus und klicken Sie auf Erstellen > Datei erstellen.

  7. Geben Sie in das Dateinamenfeld einen der folgenden Dateinamen ein und klicken Sie auf „OK“:

    • js.txt: Verwenden Sie diesen Dateinamen, um eine JavaScript-Datei zu erzeugen.
    • css.txt: Verwenden Sie diesen Dateinamen, um ein Cascading Style Sheet zu erzeugen.
  8. Öffnen Sie die Datei und geben Sie den folgenden Text ein, um das Stammverzeichnis des Pfads der Quelldateien anzugeben:

    #base=[root]

    Replace [root] with the path to the folder that contains the source files, relative to the TXT file. Verwenden Sie beispielsweise den folgenden Text, wenn sich die Quelldateien im selben Ordner wie die TXT-Datei befinden:

    #base=.

    Der folgende Code legt den Ordner „mobile“ unter dem Knoten cq:ClientLibraryFolder als Stammverzeichnis fest:

    #base=mobile

  9. On the lines below #base=[root], type the paths of the source files relative to the root. Geben Sie dabei jeden Dateinamen in einer separaten Zeile ein.

  10. Klicken Sie auf Alle speichern.

Verknüpfung mit Abhängigkeiten

Wenn der Code in Ihrem Client-Bibliotheksordner auf andere Bibliotheken verweist, müssen Sie die anderen Bibliotheken als Abhängigkeiten angeben. Durch das JSP-Tag ui:includeClientLib, das Ihren Client-Bibliotheksordner referenziert, enthält der HTML-Code einen Link auf Ihre generierte Bibliotheksdatei sowie die Abhängigkeiten.

The dependencies must be another cq:ClientLibraryFolder. Fügen Sie Ihrem cq:ClientLibraryFolder-Knoten eine Eigenschaft mit den folgenden Attributen hinzu, um Abhängigkeiten anzugeben:

  • Name: dependencies
  • Typ: String[]
  • Werte: Der Wert der Kategorieeigenschaft des cq:ClientLibraryFolder-Knotens, von dem der aktuelle Bibliotheksordner abhängig ist.

For example, the / etc/clientlibs/myclientlibs/publicmain has a dependency on the cq.jquery library. Die JSP, die die Haupt-Client-Bibliothek referenziert, erzeugt HTML-Code, der den folgenden Code enthält:

<script src="/etc/clientlibs/foundation/cq.jquery.js" type="text/javascript">
<script src="/etc/clientlibs/mylibs/publicmain.js" type="text/javascript">

Einbetten von Code aus anderen Bibliotheken

Sie können Code aus einer Client-Bibliothek in eine andere Client-Bibliothek einbetten. Zur Laufzeit wird der Code der eingebetteten Bibliothek in die generierten JS- und CSS-Dateien der einbettenden Bibliothek eingefügt.

Das Einbetten von Code ist nützlich, um Zugriff auf Bibliotheken zu ermöglichen, die in sicheren Bereichen des Repositorys gespeichert sind.

Anwendungsspezifische Client-Bibliotheksordner

It is a best practice to keep all application-related files in their application folder below /app. It is also a best practice to deny access for web site visitors to the /app folder. To satisfy both best practices, create a client library folder below the /etc folder that embeds the client library that is below /app.

Verwenden Sie die Eigenschaft "Kategorien", um den einzubettenden Clientbibliotheksordner zu identifizieren. Um die Bibliothek einzubetten, fügen Sie dem einbettenden cq:ClientLibraryFolder-Knoten eine Eigenschaft mit den folgenden Eigenschaftsattributen hinzu:

  • Name: embed
  • Typ: String[]
  • Wert: Der Wert der Eigenschaft "Kategorien"des einzubettenden cq:ClientLibraryFolder Knotens.

Minimieren von Anfragen durch Einbetten

In some cases you may find that the final HTML generated for typical page by your publish instance includes a relatively large number of <script> elements, particularly if your site is using client context information for analaytics or targeting. For example, in a non-optimized project you might find the following series of <script> elements in the HTML for a page:

<script type="text/javascript" src="/etc/clientlibs/granite/jquery.js"></script>
<script type="text/javascript" src="/etc/clientlibs/granite/utils.js"></script>
<script type="text/javascript" src="/etc/clientlibs/granite/jquery/granite.js"></script>
<script type="text/javascript" src="/etc/clientlibs/foundation/jquery.js"></script>
<script type="text/javascript" src="/etc/clientlibs/foundation/shared.js"></script>
<script type="text/javascript" src="/etc/clientlibs/foundation/personalization/kernel.js"></script>

In solchen Fällen kann es nützlich sein, den gesamten benötigten Client-Bibliothekscode in einer einzelnen Datei zu kombinieren, um die Anzahl der Anfragen in beide Richtungen beim Laden einer Seite zu reduzieren. To do this you can embed the required libraries into you app-specific client library using the embed property of the cq:ClientLibraryFolder node.

Die folgenden Client-Bibliothekskategorien sind in AEM bereits vorhanden. Sie sollten nur die Kategorien einbetten, die für die Funktion Ihrer Website erforderlich sind. Sie sollten jedoch die hier angegebene Reihenfolge einhalten:

  1. browsermap.standard
  2. browsermap
  3. jquery-ui
  4. cq.jquery.ui
  5. personalization
  6. personalization.core
  7. personalization.core.kernel
  8. personalization.clientcontext.kernel
  9. personalization.stores.kernel
  10. personalization.kernel
  11. personalization.clientcontext
  12. personalization.stores
  13. cq.collab.comments
  14. cq.collab.feedlink
  15. cq.collab.ratings
  16. cq.collab.toggle
  17. cq.collab.forum
  18. cq.cleditor

Pfade in CSS-Dateien

Wenn Sie CSS-Dateien einbetten, verwendet der generierte CSS-Code Pfade zu Ressourcen, die relativ zur einbettenden Bibliothek sind. For example, the publicly-accessible library /etc/client/libraries/myclientlibs/publicmain embeds the /apps/myapp/clientlib client library:

screen_shot_2012-05-29at20122pm

Die Datei main.css enthält den folgenden Stil:

body {
  padding: 0;
  margin: 0;
  background: url(images/bg-full.jpg) no-repeat center top;
  width: 100%;
}

Die CSS-Datei, die der publicmain-Knoten generiert, enthält den folgenden Stil mit der URL des Originalbilds:

body {
  padding: 0;
  margin: 0;
  background: url(../../../apps/myapp/clientlib/styles/images/bg-full.jpg) no-repeat center top;
  width: 100%;
}

Verwenden einer Bibliothek für bestimmte Mobile-Gruppen

Verwenden Sie die Eigenschaft channels eines Client-Bibliotheksordners, um die Mobile-Gruppe zu identifizieren, die die Bibliothek verwendet. Die Eigenschaft channels ist hilfreich, wenn Bibliotheken derselben Kategorie für verschiedene Geräte entwickelt wurden.

To associate a client library folder with a device group, add a property to your cq:ClientLibraryFolder node with the following attributes:

  • Name: kanal
  • Typ: String[]
  • Werte: Der Name der mobilen Gruppe. Um den Bibliotheksordner aus einer Gruppe auszuschließen, setzen Sie ein Ausrufezeichen („!“) vor den Namen.

For example, the following table lists the value of the channels property for each client library folder of the cq.widgets category:

Client-Bibliotheksordner Wert der Eigenschaft „channels“
/libs/cq/analytics/widgets !touch
/libs/cq/analytics/widgets/themes/default !touch
/libs/cq/cloudserviceconfigs/widgets !touch
/libs/cq/searchpromote/widgets !touch
/libs/cq/searchpromote/widgets/themes/default [kein Wert]
/libs/cq/touch/widgets touch
/libs/cq/touch/widgets/themes/default touch
/libs/cq/ui/widgets !touch
/libs/cq/ui/widgets/themes/default !touch

Verwendung von Präprozessoren

AEM allows for pluggable preprocessors and ships with support for YUI Compressor for CSS and JavaScript and Google Closure Compiler (GCC) for JavaScript with YUI set as AEM's default preprocessor.

Die austauschbaren Präprozessoren bieten flexible Einsatzmöglichkeiten, z. B.:

  • Definition von ScriptProcessors, die Skriptquellen verarbeiten können
  • Prozessoren sind mit Optionen konfigurierbar
  • Prozessoren können zur Minimierung, aber auch für nicht minimierte Fälle verwendet werden
  • Die clientlib kann den zu verwendenden Prozessor festlegen
Hinweis

Standardmäßig verwendet AEM YUI Compressor. In der GitHub-Dokumentation zu YUI Compressor finden Sie eine Liste bekannter Probleme. Ein Wechsel zu GCC Compressor für bestimmte clientlibs kann einige Probleme beheben, die mit YUI auftreten.

ACHTUNG

Platzieren Sie eine minimierte Bibliothek nicht in einer Client-Bibliothek. Stellen Sie stattdessen die Rohbibliothek bereit. Wenn eine Minimierung erforderlich ist, können Sie die Möglichkeiten der Präprozessoren verwenden.

Verwendung

Sie können die Präprozessorkonfiguration pro Client-Bibliothek oder systemweit festlegen.

  • Add the multivalue properties cssProcessor and jsProcessor on the clientlibrary node

  • Oder definieren Sie die standardmäßige Systemkonfiguration über die OSGi-Konfiguration im HTML Library Manager

Eine Vorprozessorkonfiguration auf dem Knoten clientlib hat Vorrang vor der OSGI-Konfiguration.

Format und Beispiele

Format

config:= mode ":" processorName options*;
mode:= "default" | "min";
processorName := "none" | <name>;
options := ";" option;
option := name "=" value;

YUI Compressor für CSS-Minimierung und GCC für JS

cssProcessor: ["default:none", "min:yui"]
jsProcessor: ["default:none", "min:gcc;compilationLevel=advanced"]

Typescript zur Vorverarbeitung und GCC zur Minimierung und Verschleierung

jsProcessor: [
   "default:typescript",
   "min:typescript", 
   "min:gcc;obfuscate=true"
]

Weitere GCC-Optionen

failOnWarning (defaults to "false")
languageIn (defaults to "ECMASCRIPT5")
languageOut (defaults to "ECMASCRIPT5")
compilationLevel (defaults to "simple") (can be "whitespace", "simple", "advanced")

Weitere Informationen zu GCC-Optionen finden Sie in der GCC-Dokumentation.

Festlegen des Systemstandard-Minimierers

YUI ist in AEM der Standardminimierer. Um stattdessen GCC festzulegen, führen Sie die folgenden Schritte aus.

  1. Rufen Sie Apache Felix Config Manager unter http://localhost:4502/system/console/configMgr auf.

  2. Find and edit the Adobe Granite HTML Library Manager.

  3. Aktivieren Sie die Option Minimieren (wenn nicht bereits aktiviert).

  4. Set the value JS Processor Default Configs to min:gcc.

    Options can be passed if separated with a semicolon e.g. min:gcc;obfuscate=true.

  5. Klicken Sie auf Speichern, um die Änderungen zu speichern.

Debugging-Tools

AEM bietet eine Vielzahl von Tools zum Debuggen und Testen von Client-Bibliotheksordnern an.

Eingebettete Dateien anzeigen

Wenn Sie den Ursprung von eingebettetem Code nachvollziehen oder sicherstellen möchten, dass eingebettete Client-Bibliotheken die erwarteten Ergebnisse produzieren, können Sie die Namen der Dateien anzeigen, die zur Laufzeit eingebettet werden. Um die Dateinamen anzuzeigen, hängen Sie den Parameter debugClientLibs=true an die URL Ihrer Webseite an. The library that is generated contains @import statements instead of the embedded code.

In the example in the previous Embedding Code From Other Libraries section, the /etc/client/libraries/myclientlibs/publicmain client library folder embeds the /apps/myapp/clientlib client library folder. Wenn Sie den Parameter an die Webseite anhängen, wird der folgende Link im Quellcode der Seite erzeugt:

<link rel="stylesheet" href="/etc/clientlibs/mycientlibs/publicmain.css">

Wenn Sie die Datei publicmain.css öffnen, sehen Sie den folgenden Code:

@import url("/apps/myapp/clientlib/styles/main.css");
  1. Hängen Sie in der Adressleiste Ihres Webbrowsers den folgenden Text an die URL Ihres HTML-Codes an:

    ?debugClientLibs=true

  2. Öffnen Sie den Seiten-Quellcode, nachdem die Seite geladen wurde.

  3. Klicken Sie auf den Link, der als href für das Link-Element angegeben ist, um die Datei zu öffnen und den Quellcode anzuzeigen.

Ermitteln der Client-Bibliotheken

The /libs/cq/granite/components/dumplibs/dumplibs component generates a page of information about all client library folders on the system. The /libs/granite/ui/content/dumplibs node has the component as a resource type. Um die Seite zu öffnen, verwenden Sie die folgende URL (d. h. den Host und Port ändern Sie nach Bedarf):

https://<host>:<port>/libs/granite/ui/content/dumplibs.test.html

Zu den Informationen gehören der Bibliothekspfad und -typ (CSS oder JS) und die Werte der Bibliotheksattribute, wie z. B. Kategorien und Abhängigkeiten. Nachfolgende Tabellen auf der Seite zeigen die Bibliotheken in jeder Kategorie und jedem Kanal.

Anzeigen der generierten Ausgabe

The dumplibs component includes a test selector that displays the source code that is generated for ui:includeClientLib tags. Die Seite enthält Code für verschiedene Kombinationen von js-, css- und themed-Attributen.

  1. Wählen Sie eine der folgenden Methoden, um die Testausgabeseite zu öffnen:

    • From the dumplibs.html page, click the link in the Click here for output testing text.

    • Öffnen Sie die folgende URL in Ihrem Webbrowser (verwenden Sie je nach Bedarf einen anderen Host und Port):

      • http://<host>:<port>/libs/granite/ui/content/dumplibs.html

    Die Standardseite zeigt die Ausgabe für Tags ohne Wert für das category-Attribut.

  2. To see the output for a category, type the value of the client library's categories property and click Submit Query.

Konfiguration des Umgangs mit Bibliotheken für Entwicklung und Produktion

Der HTML Library Manager-Service verarbeitet cq:ClientLibraryFolder-Tags und generiert die Bibliotheken zur Laufzeit. Vom Typ der Umgebung (Entwicklung oder Produktion) hängt ab, wie Sie den Dienst konfigurieren sollten:

  • Verbesserung der Sicherheit: Debugging deaktivieren
  • Verbesserung der Leistung: Freie Bereiche entfernen und Bibliotheken komprimieren.
  • Lesbarkeit verbessern: Freie Bereiche beibehalten und nicht komprimieren.

Weitere Informationen zur Konfiguration des Services finden Sie unter AEM HTML Library Manager.

Auf dieser Seite