Abilitare i componenti core per moduli adattivi :headding-anchor:enable-headless-adaptive-forms-on-aem-forms-cloud-service
Abilitando i componenti core Adaptive Forms su AEM Forms as a Cloud Service, puoi iniziare a creare, pubblicare e distribuire componenti core basati su Adaptive Forms e Headless Forms utilizzando le istanze del Cloud Service AEM Forms su più canali. Per utilizzare Headless Adaptive Forms è necessario un ambiente abilitato per i Componenti core Forms adattivi.
Considerazioni
-
Quando crei un nuovo programma AEM Forms as a Cloud Service, I componenti core Adaptive Forms e Headless Adaptive Forms sono già abilitati per il tuo ambiente.
-
Se hai un programma Forms as a Cloud Service precedente in cui i Componenti core sono non abilitati, puoi aggiungere le dipendenze dei Componenti core Forms adattivi al tuo archivio AEM as a Cloud Service e distribuire l'archivio negli ambienti di Cloud Service per abilitare Forms adattivo headless.
-
Se l'ambiente di Cloud Service esistente offre l'opzione per creare Forms adattivo basato su Componenti core, i componenti core Forms adattivo e i Forms adattativi headless sono già abilitati per il tuo ambiente e puoi distribuire Forms adattivo basato su Componenti core come moduli headless a canali quali dispositivi mobili, web, app native e servizi che richiedono una rappresentazione headless di Forms adattivo.
Abilitare i componenti core Forms adattivi e i Forms adattativi headless :headding-anchor:enable-headless-forms
Per abilitare i componenti core Adaptive Forms e Headless Adaptive Forms per un ambiente AEM Forms as a Cloud Service, effettua le seguenti operazioni, nell’ordine elencato
1. Clonare l’archivio as a Cloud Service Git di AEM Forms :headding-anchor:clone-git-repository
-
Accedi a Cloud Manager e seleziona la tua organizzazione e il tuo programma.
-
Passa alla scheda Pipeline dalla pagina Panoramica del programma, quindi fai clic sul pulsante Accedi a dati archivio per accedere e gestire il tuo archivio Git. La pagina include le seguenti informazioni:
- URL dell’archivio Git di Cloud Manager.
- Credenziali dell’archivio Git (nome utente e password), nome utente Git.
Fare clic su Genera password per visualizzare o generare la password.
-
Aprire il terminale o il prompt dei comandi sul computer locale ed eseguire il comando seguente:
code language-shell git clone [Git Repository URL]
Quando richiesto, immettere le credenziali. L'archivio viene clonato nel computer locale.
2. Aggiungere all’archivio Git le dipendenze dei Componenti core adattivi di Forms :headding-anchor:add-adaptive-forms-core-components-dependencies
-
Apri la cartella dell’archivio Git in un editor di codice di testo normale. Ad esempio, Codice VS.
-
Apri il file
[AEM Repository Folder]\pom.xml
per la modifica. -
Sostituire le versioni dei componenti
core.forms.components.version
,core.forms.components.af.version
ecore.wcm.components.version
con le versioni specificate nella documentazione dei componenti core. Se il componente non esiste, aggiungi questi componenti.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>
-
Nella sezione delle dipendenze del file
[AEM Repository Folder]\pom.xml
, aggiungere le dipendenze seguenti e salvare il file.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 -->
-
Apri il file
[AEM Repository Folder]/all/pom.xml
per la modifica. Aggiungere le dipendenze seguenti nella sezione<embeddeds>
e salvare il file.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 Sostituisci ${appId}
con il tuo appId.Per trovare ${appId}
, nel file[AEM Repository Folder]/all/pom.xml
, cerca il termine-packages/application/install
. Il testo prima del termine-packages/application/install
è${appId}
. Il codice seguente, ad esempio,myheadlessform
è${appId}
.code language-none com.myheadlessform myheadlessform.ui.apps zip /apps/myheadlessform-packages/application install
-
Nella sezione
<dependencies>
del file[AEM Repository Folder]/all/pom.xml
, aggiungere le dipendenze seguenti e salvare il file: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>
-
Apri
[AEM Repository Folder]/ui.apps/pom.xml
per la modifica. Aggiungere la dipendenzaaf-core bundle
e salvare il file.code language-xml <dependency> <groupId>com.adobe.aem</groupId> <artifactId>core-forms-components-af-core</artifactId> </dependency>
note note NOTE Assicurati che i seguenti artefatti dei Componenti core adattivi di Forms non siano inclusi nel progetto. <dependency>
<groupId>com.adobe.aem</groupId>
<artifactId>core-forms-components-apps</artifactId>
</dependency>
e <dependency>
<groupId>com.adobe.aem</groupId>
<artifactId>core-forms-components-core</artifactId>
</dependency>
-
Salva e chiudi il file.
3. Genera e distribuisci il codice aggiornato
Distribuisci il codice aggiornato negli ambienti di sviluppo e Cloud Service locali per abilitare i Componenti core in entrambi gli ambienti:
Generare e distribuire il codice aggiornato in un ambiente di sviluppo locale :headding-anchor:core-components-on-aem-forms-local-sdk
-
Apri il prompt dei comandi o il terminale.
-
Passa alla directory principale del progetto dell’archivio Git.
-
Esegui il seguente comando per generare il pacchetto per il tuo ambiente:
code language-shell mvn clean install
Una volta creato correttamente il pacchetto, puoi trovarlo nella [cartella dell'archivio Git]\all\target[appid].all-[versione].zip
-
Utilizza Gestione pacchetti per distribuire il pacchetto [Cartella di progetto Archetipo AEM]\all\target[appid].all-[versione].zip nell'ambiente di sviluppo locale.
Generare e distribuire il codice aggiornato in un ambiente AEM Forms as a Cloud Service :headding-anchor:core-components-on-aem-forms-cs
-
Aprire il terminale o il prompt dei comandi.
-
Passa a
[AEM Repository Folder]
ed esegui i seguenti comandi nell'ordine elencatocode 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
-
Dopo il commit dei file nell'archivio Git, Esegui la pipeline.
Una volta completata l’esecuzione della pipeline, i componenti core Adaptive Forms vengono abilitati per l’ambiente corrispondente. All’ambiente Forms as a Cloud Service vengono inoltre aggiunti un modello Forms adattivo (Componenti core) e un tema Canvas 3.0, che offrono opzioni per personalizzare e creare componenti core basati su Adaptive Forms.
Domande frequenti :headding-anchor:faq
Cosa sono i Componenti core? :headding-anchor:core-components
I Componenti core sono un insieme di componenti WCM (Web Content Management) standardizzati per l'AEM che consentono di velocizzare i tempi di sviluppo e ridurre i costi di manutenzione dei siti Web.
Quali sono tutte le funzionalità aggiunte all’abilitazione dei componenti core? :headding-anchor:core-components-capabilities
Quando i componenti core Adaptive Forms sono abilitati per il tuo ambiente, all’ambiente vengono aggiunti un modello di modulo adattivo basato su Componenti core vuoto e un tema Canvas 3.0. Dopo aver abilitato i componenti core Forms adattivi per il tuo ambiente, puoi:
- Creazione di componenti core basati su Forms adattivo.
- Creare modelli di modulo adattivo basati su componenti core.
- Creare temi personalizzati per i modelli di modulo adattivo basati su Componenti core.
- Distribuisci le rappresentazioni JSON del modulo adattivo basate su Componente core a canali quali dispositivi mobili, web, app native e servizi che richiedono la rappresentazione headless di un modulo.
I componenti core Forms adattivi sono abilitati per il mio ambiente? :headding-anchor:enable-components
Per verificare che i componenti core Adaptive Forms siano abilitati per il tuo ambiente:
-
Apri il file
[AEM Repository Folder]/all/pom.xml
dell'archivio Git del Cloud Service AEM Forms. -
Cerca le dipendenze seguenti:
- 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
Se le dipendenze esistono, i componenti core Adaptive Forms sono abilitati per il tuo ambiente.