DokumentationAEM as a Cloud ServiceBenutzerhandbuch

Aktivieren der Kernkomponenten für adaptive Formulare enable-headless-adaptive-forms-on-aem-forms-cloud-service

Last update: Mon Jul 15 2024 00:00:00 GMT+0000 (Coordinated Universal Time)

Erstellt für:

  • Admin
  • Entwickler
  • Benutzende
Version
Artikel-Link
AEM 6.5
Hier klicken
AEM as a Cloud Service
Dieser Artikel

Durch die Aktivierung der Kernkomponenten für adaptive Formulare in AEM Forms as a Cloud Service können Sie mit der Erstellung, Veröffentlichung und Bereitstellung von auf Kernkomponenten basierenden adaptiven Formularen und Headless-Formularen beginnen, und das mithilfe Ihrer Instanzen von AEM Forms as a Cloud Service für mehrere Kanäle. Sie benötigen eine Umgebung mit aktivierten Kernkomponenten für adaptive Formulare, um adaptive Headless-Formulare zu verwenden.

Überlegungen

Aktivieren der Kernkomponenten für adaptive Formulare und adaptive Headless-Formulare enable-headless-forms

Führen Sie die folgenden Schritte in der angegebenen Reihenfolge aus, um die Kernkomponenten für adaptive Formulare und adaptive Headless-Formulare für eine AEM Forms as a Cloud Service-Umgebung zu aktivieren

Aktivieren der Kernkomponenten für adaptive Formulare und adaptive Headless-Formulare

1. Klonen Sie Ihr AEM Forms as a Cloud Service-Git-Repository clone-git-repository

  1. Melden Sie sich bei Cloud Manager an und wählen Sie Ihre Organisation und Ihr Programm aus.

  2. Navigieren Sie von Ihrer Programmübersichtsseite zur Karte Pipelines und klicken Sie auf die Schaltfläche Zugriff auf Repo Info, um auf Ihr Git-Repository zuzugreifen und es zu verwalten. Die Seite enthält die folgenden Informationen:

    • Die URL zum Git-Repository von Cloud Manager.
    • Anmeldeinformationen des Git-Repositorys (Benutzername und Password), Git-Benutzername.

    Klicken Sie auf Kennwort generieren, um das Kennwort anzuzeigen oder zu generieren.

  3. Öffnen Sie das Terminal oder eine Eingabeaufforderung auf Ihrem lokalen Computer und führen Sie den folgenden Befehl aus:

    code language-shell 
    git clone [Git Repository URL]

    Geben Sie bei Aufforderung die Anmeldeinformationen ein. Das Repository wird auf Ihrem lokalen Computer geklont.

2. Hinzufügen von Abhängigkeiten von Kernkomponenten für adaptive Formulare zu Ihrem Git-Repository add-adaptive-forms-core-components-dependencies

  1. Öffnen Sie Ihren Git-Repository-Ordner in einem einfachen Texteditor. Beispiel: VS Code.

  2. Öffnen Sie die Datei [AEM Repository Folder]\pom.xml, um sie zu bearbeiten.

  3. Ersetzen Sie die Versionen der Komponenten core.forms.components.version, core.forms.components.af.version und core.wcm.components.version durch die in der Dokumentation zu Kernkomponenten angegebenen Versionen. Wenn die Komponente nicht vorhanden ist, fügen Sie diese Komponenten hinzu.

    code language-xml 
    <!-- Replace the version with the latest released version at https://github.com/adobe/aem-core-forms-components/tags -->

<properties>
    <core.wcm.components.version>2.22.10</core.wcm.components.version>
    <core.forms.components.version>2.0.18</core.forms.components.version>
    <core.forms.components.af.version>2.0.18</core.forms.components.af.version>
</properties>

    Erwähnung der neuesten Version der Kernkomponenten für adaptive Formulare

  4. Fügen Sie im Abschnitt „Abhängigkeiten“ der Datei [AEM Repository Folder]\pom.xml die folgenden Abhängigkeiten hinzu und speichern Sie die Datei.

    code language-xml 
        <!-- WCM Core Component Examples Dependencies -->
        <dependency>
            <groupId>com.adobe.cq</groupId>
            <artifactId>core.wcm.components.examples.ui.apps</artifactId>
            <type>zip</type>
            <version>${core.wcm.components.version}</version>
        </dependency>
        <dependency>
            <groupId>com.adobe.cq</groupId>
            <artifactId>core.wcm.components.examples.ui.content</artifactId>
            <type>zip</type>
            <version>${core.wcm.components.version}</version>
        </dependency>
        <dependency>
            <groupId>com.adobe.cq</groupId>
            <artifactId>core.wcm.components.examples.ui.config</artifactId>
            <version>${core.wcm.components.version}</version>
            <type>zip</type>
        </dependency>
        <!-- End of WCM Core Component Examples Dependencies -->
        <!-- Forms Core Component Dependencies -->
        <dependency>
            <groupId>com.adobe.aem</groupId>
            <artifactId>core-forms-components-core</artifactId>
            <version>${core.forms.components.version}</version>
        </dependency>
        <dependency>
            <groupId>com.adobe.aem</groupId>
            <artifactId>core-forms-components-apps</artifactId>
            <version>${core.forms.components.version}</version>
            <type>zip</type>
        </dependency>
        <dependency>
            <groupId>com.adobe.aem</groupId>
            <artifactId>core-forms-components-af-core</artifactId>
            <version>${core.forms.components.version}</version>
        </dependency>
        <dependency>
            <groupId>com.adobe.aem</groupId>
            <artifactId>core-forms-components-af-apps</artifactId>
            <version>${core.forms.components.version}</version>
            <type>zip</type>
        </dependency>
        <dependency>
            <groupId>com.adobe.aem</groupId>
            <artifactId>core-forms-components-examples-apps</artifactId>
            <type>zip</type>
            <version>${core.forms.components.version}</version>
        </dependency>
        <dependency>
            <groupId>com.adobe.aem</groupId>
            <artifactId>core-forms-components-examples-content</artifactId>
            <type>zip</type>
            <version>${core.forms.components.version}</version>
        </dependency>
<!-- End of AEM Forms Core Component Dependencies -->

  5. Öffnen Sie die Datei [AEM Repository Folder]/all/pom.xml, um sie zu bearbeiten. Fügen Sie die folgenden Abhängigkeiten in den Abschnitt <embeddeds> ein und speichern Sie die Datei.

    code language-xml 
    <!-- WCM Core Component Examples Dependencies -->

<!-- inside plugin config of filevault-package-maven-plugin -->
<!-- embed wcm core components examples artifacts -->

<embedded>
    <groupId>com.adobe.cq</groupId>
    <artifactId>core.wcm.components.examples.ui.apps</artifactId>
    <type>zip</type>
    <target>/apps/${appId}-vendor-packages/content/install</target>
</embedded>
<embedded>
    <groupId>com.adobe.cq</groupId>
    <artifactId>core.wcm.components.examples.ui.content</artifactId>
    <type>zip</type>
    <target>/apps/${appId}-vendor-packages/content/install</target>
</embedded>
<embedded>
    <groupId>com.adobe.cq</groupId>
    <artifactId>core.wcm.components.examples.ui.config</artifactId>
    <type>zip</type>
    <target>/apps/${appId}-vendor-packages/content/install</target>
</embedded>
<!-- embed forms core components artifacts -->
<embedded>
    <groupId>com.adobe.aem</groupId>
    <artifactId>core-forms-components-af-apps</artifactId>
    <type>zip</type>
    <target>/apps/${appId}-vendor-packages/application/install</target>
</embedded>
<embedded>
    <groupId>com.adobe.aem</groupId>
    <artifactId>core-forms-components-af-core</artifactId>
    <target>/apps/${appId}-vendor-packages/application/install</target>
</embedded>
<embedded>
    <groupId>com.adobe.aem</groupId>
    <artifactId>core-forms-components-examples-apps</artifactId>
    <type>zip</type>
    <target>/apps/${appId}-vendor-packages/content/install</target>
</embedded>
<embedded>
    <groupId>com.adobe.aem</groupId>
    <artifactId>core-forms-components-examples-content</artifactId>
    <type>zip</type>
    <target>/apps/${appId}-vendor-packages/content/install</target>
</embedded>
    note note
    NOTE
    Ersetzen Sie ${appId} durch Ihre appId.
    Um Ihre ${appId} zu finden, suchen Sie in der Datei [AEM Repository Folder]/all/pom.xml den Begriff -packages/application/install. Der Text vor dem Begriff -packages/application/install ist Ihre ${appId}. Der folgende Code myheadlessform ist zum Beispiel ${appId}.
    code language-none 
    



com.myheadlessform

myheadlessform.ui.apps

zip

/apps/myheadlessform-packages/application install

  6. Fügen Sie im Abschnitt <dependencies> der Datei [AEM Repository Folder]/all/pom.xml die folgenden Abhängigkeiten hinzu und speichern Sie die Datei:

    code language-xml 
            <!-- Other existing dependencies -->
        <!-- wcm core components examples dependencies -->
        <dependency>
            <groupId>com.adobe.cq</groupId>
            <artifactId>core.wcm.components.examples.ui.apps</artifactId>
            <type>zip</type>
        </dependency>
        <dependency>
            <groupId>com.adobe.cq</groupId>
            <artifactId>core.wcm.components.examples.ui.config</artifactId>
            <type>zip</type>
            </dependency>
        <dependency>
            <groupId>com.adobe.cq</groupId>
            <artifactId>core.wcm.components.examples.ui.content</artifactId>
            <type>zip</type>
        </dependency>
            <!-- forms core components dependencies -->
        <dependency>
            <groupId>com.adobe.aem</groupId>
            <artifactId>core-forms-components-af-apps</artifactId>
            <type>zip</type>
        </dependency>
        <dependency>
            <groupId>com.adobe.aem</groupId>
            <artifactId>core-forms-components-examples-apps</artifactId>
            <type>zip</type>
        </dependency>
            <dependency>
            <groupId>com.adobe.aem</groupId>
            <artifactId>core-forms-components-examples-content</artifactId>
            <type>zip</type>
        </dependency>

  7. Öffnen Sie [AEM Repository Folder]/ui.apps/pom.xml zur Bearbeitung. Fügen Sie die Abhängigkeit af-core bundle hinzu und speichern Sie die Datei.

    code language-xml 
        <dependency>
    <groupId>com.adobe.aem</groupId>
    <artifactId>core-forms-components-af-core</artifactId>
    </dependency>
    note note
    NOTE
    Achten Sie darauf, dass die folgenden Artefakte der Kernkomponenten von adaptiven Formularen nicht in Ihr Projekt eingeschlossen werden.
    <dependency>
    <groupId>com.adobe.aem</groupId>
    <artifactId>core-forms-components-apps</artifactId>
    </dependency>
    und
    <dependency>
    <groupId>com.adobe.aem</groupId>
    <artifactId>core-forms-components-core</artifactId>
    </dependency>

  8. Speichern und schließen Sie die Datei.

3. Erstellen und Bereitstellen des aktualisierten Codes

Stellen Sie den aktualisierten Code in Ihren lokalen Entwicklungs- und Cloud Service-Umgebungen bereit, um die Kernkomponenten in beiden Umgebungen zu aktivieren:

Erstellen und Bereitstellen von aktualisiertem Code in einer lokalen Entwicklungsumgebung core-components-on-aem-forms-local-sdk

  1. Öffnen Sie die Eingabeaufforderung oder das Terminal.

  2. Navigieren Sie zum Stammverzeichnis Ihres Git-Repository-Projekts.

  3. Führen Sie den folgenden Befehl aus, um das Paket für Ihre Umgebung zu erstellen:

    code language-shell 
        mvn clean install

    Nachdem das Paket erfolgreich erstellt wurde, finden Sie es unter [Git-Repository-Ordner]\all\target[appid].all-[version].zip

  4. Verwenden Sie den Package Manager, um das Paket [AEM Archetyp-Projektordner]\all\target[appid].all-[version].zip in der lokalen Entwicklungsumgebung bereitzustellen.

Erstellen und Bereitstellen von aktualisiertem Code in einer AEM Forms as a Cloud Service-Umgebung core-components-on-aem-forms-cs

  1. Öffnen Sie das Terminal oder die Eingabeaufforderung.

  2. Navigieren Sie zu Ihrem [AEM Repository Folder] und führen Sie die folgenden Befehle in der angegebenen Reihenfolge aus

    code language-shell 
     git add pom.xml
 git add all/pom.xml
 git add ui.apps/pom.xml
 git commit -m "Added dependencies for Adaptive Forms Core Components"
 git push origin

  3. Nachdem die Dateien in das Git-Repository übertragen wurden, führen Sie die Pipeline aus.

    Nach erfolgreicher Ausführung der Pipeline sind die Kernkomponenten für adaptive Formulare für die entsprechende Umgebung aktiviert. Außerdem werden Ihrer Forms as a Cloud Service-Umgebung eine Vorlage für adaptive Formulare (Kernkomponenten) sowie ein Design für Canvas 3.0 hinzugefügt, was Ihnen Optionen zum Anpassen und Erstellen von Kernkomponenten auf Basis von adaptiven Formularen bietet.

Häufig gestellte Fragen faq

Was sind Kernkomponenten? core-components

Die Kernkomponenten sind eine Reihe von standardisierten Web Content Management(WCM)-Komponenten für AEM, die die Entwicklungszeit beschleunigen und die Wartungskosten Ihrer Websites reduzieren.

Welche Funktionen werden hinzugefügt, wenn Kernkomponenten aktiviert sind? core-components-capabilities

Wenn die Kernkomponenten für adaptive Formulare für Ihre Umgebung aktiviert sind, werden Ihrer Umgebung eine leere, auf Kernkomponenten basierende Vorlage für adaptive Formulare und ein Canvas 3.0-Design hinzugefügt. Nachdem Sie die Kernkomponenten für adaptive Formulare für Ihre Umgebung aktiviert haben, können Sie Folgendes tun:

Sind für meine Umgebung Kernkomponenten für adaptive Formulare aktiviert? enable-components

So prüfen Sie, ob die Kernkomponenten für adaptive Formulare für Ihre Umgebung aktiviert sind:

  1. Klonen Sie Ihr AEM Forms as a Cloud Service-Repository.

  2. Öffnen Sie die Datei [AEM Repository Folder]/all/pom.xml Ihres AEM Forms as a Cloud Service-Git-Repositorys.

  3. Suchen Sie nach den folgenden Abhängigkeiten:

    • core-forms-components-af-core
    • core-forms-components-core
    • core-forms-components-apps
    • core-forms-components-af-apps
    • core-forms-components-examples-apps
    • core-forms-components-examples-content

    Suchen Sie das Artefakt „core-forms-components-af-core“ in „all/pom.xml“.

    Wenn die Abhängigkeiten vorhanden sind, sind die Kernkomponenten für adaptive Formulare für Ihre Umgebung aktiviert.

Related Articles
recommendation-more-help
fbcff2a9-b6fe-4574-b04a-21e75df764ab