Habilitar os componentes principais dos formulários adaptáveis enable-headless-adaptive-forms-on-aem-forms-cloud-service

Versão
Link do artigo
AEM 6.5
Clique aqui
AEM as a Cloud Service
Este artigo

A habilitação dos Componentes principais do Forms adaptável no AEM Forms as a Cloud Service permite que você comece a criar, publicar e fornecer Componentes principais baseados no Forms adaptável e no Forms headless usando as instâncias de Cloud Service do AEM Forms para vários canais. Você precisa do ambiente habilitado dos Componentes principais adaptáveis do Forms para usar o Forms adaptável headless.

Considerações

Ativar os Componentes principais adaptáveis do Forms e o Forms adaptável headless enable-headless-forms

Execute as seguintes etapas, na ordem listada, para ativar os Componentes principais adaptáveis do Forms e o Forms adaptável headless para um ambiente as a Cloud Service do AEM Forms

Habilitar componentes principais e formulários adaptáveis headless

1. Clonar o repositório as a Cloud Service do AEM Forms clone-git-repository

  1. Faça logon no Cloud Manager e selecione sua organização e programa.

  2. Navegue até o cartão Pipelines na página Visão geral do programa, clique no botão Acessar informações do repositório para acessar e gerenciar o Repositório Git. A página inclui as seguintes informações:

    • URL do Repositório Git da Cloud Manager.
    • Credenciais do nome de usuário do Git do Repositório Git (nome de usuário e senha).

    Clique em Gerar senha para exibir ou gerar a senha.

  3. Abra o terminal ou o prompt de comando no computador local e execute o seguinte comando:

    code language-shell
    git clone [Git Repository URL]
    

    Quando solicitado, forneça as credenciais. O repositório é clonado no computador local.

2. Adicione as dependências dos Componentes principais do Forms adaptável ao Repositório Git add-adaptive-forms-core-components-dependencies

  1. Abra a pasta Repositório Git em um editor de código de texto simples. Por exemplo, Código VS.

  2. Abra o arquivo [AEM Repository Folder]\pom.xml para edição.

  3. Substitua as versões dos componentes core.forms.components.version, core.forms.components.af.version e core.wcm.components.version pelas versões especificadas na documentação dos componentes principais. Se o componente não existir, adicione esses componentes.

    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>
    

    Mencione a versão mais recente dos Componentes principais do Forms

  4. Na seção de dependências do arquivo [AEM Repository Folder]\pom.xml, adicione as seguintes dependências e salve o arquivo.

    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. Abra o arquivo [AEM Repository Folder]/all/pom.xml para edição. Adicione as seguintes dependências na seção <embeddeds> e salve o arquivo.

    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
    Substitua ${appId} com sua appId.
    Para encontrar seu ${appId}, no arquivo [AEM Repository Folder]/all/pom.xml, pesquise o termo -packages/application/install. O texto antes do termo -packages/application/install é o seu ${appId}. Por exemplo, o código a seguir, myheadlessform é ${appId}.
    code language-none
    
    
    
    
    com.myheadlessform
    
    myheadlessform.ui.apps
    
    zip
    
    /apps/myheadlessform-packages/application install
    
  6. Na seção <dependencies> do arquivo [AEM Repository Folder]/all/pom.xml, adicione as seguintes dependências e salve o arquivo:

    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. Abra o [AEM Repository Folder]/ui.apps/pom.xml para edição. Adicione a dependência af-core bundle e salve o arquivo.

    code language-xml
        <dependency>
        <groupId>com.adobe.aem</groupId>
        <artifactId>core-forms-components-af-core</artifactId>
        </dependency>
    
    note note
    NOTE
    Verifique se os seguintes artefatos dos Componentes principais adaptáveis do Forms não estão incluídos em seu projeto.
    <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>
  8. Salvar e fechar o arquivo.

3. Criar e implantar o código atualizado

Implante o código atualizado em seus ambientes de desenvolvimento e Cloud Service locais para ativar os Componentes principais em ambos os ambientes:

Criar e implantar código atualizado em um ambiente de desenvolvimento local core-components-on-aem-forms-local-sdk

  1. Abra o prompt de comando ou o terminal.

  2. Navegue até o diretório raiz do seu projeto do Repositório Git.

  3. Execute o seguinte comando para criar o pacote para o seu ambiente:

    code language-shell
        mvn clean install
    

    Depois que o pacote for criado com êxito, você poderá encontrá-lo na [Pasta do Repositório Git]\all\target[appid].all-[version].zip

  4. Use o Gerenciador de Pacotes para implantar o pacote [Pasta de Projeto do Arquétipo AEM]\all\target[appid].all-[version].zip no ambiente de desenvolvimento local.

Criar e implantar código atualizado em um ambiente as a Cloud Service do AEM Forms core-components-on-aem-forms-cs

  1. Abra o terminal ou o prompt de comando.

  2. Navegue até [AEM Repository Folder] e execute os seguintes comandos na ordem listada

    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. Depois que os arquivos forem confirmados no Repositório Git, Execute o pipeline.

    Depois que a execução do pipeline for bem-sucedida, os Componentes principais adaptáveis do Forms serão ativados para o ambiente correspondente. Além disso, um modelo de Forms adaptável (Componentes principais) e o tema do Canvas 3.0 são adicionados ao seu ambiente as a Cloud Service do Forms, fornecendo opções para personalizar e criar Componentes principais com base no Forms adaptável.

Perguntas frequentes faq

Quais são os componentes principais? core-components

Os Componentes principais são um conjunto de componentes padronizados de Gerenciamento de Conteúdo na Web (WCM) para o AEM, a fim de acelerar o tempo de desenvolvimento e reduzir o custo de manutenção de seus sites.

Quais são todos os recursos adicionados na ativação dos componentes principais? core-components-capabilities

Quando os Componentes principais do Forms adaptável estiverem ativados para seu ambiente, um modelo de Formulário adaptável baseado em Componentes principais em branco e o tema do Canvas 3.0 serão adicionados ao seu ambiente. Depois de ativar os Componentes principais adaptáveis do Forms no seu ambiente, você pode:

Os Componentes principais adaptáveis do Forms estão habilitados para meu ambiente? enable-components

Para verificar se os Componentes principais do Adaptive Forms estão ativados para o seu ambiente:

  1. Clonar o repositório as a Cloud Service do AEM Forms.

  2. Abra o arquivo [AEM Repository Folder]/all/pom.xml do Repositório Git do AEM Forms Cloud Service.

  3. Procure as seguintes dependências:

    • 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

    localize o artefato core-forms-components-af-core em all/pom.xml

    Se as dependências existirem, os Componentes principais adaptáveis do Forms serão ativados para o seu ambiente.

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