Prepare-se para implantar um aplicativo DOM virtual do Oracle JET

Introdução

Este tutorial mostra como preparar um aplicativo DOM virtual do Oracle JavaScript Extension Toolkit (Oracle JET) para implantação.

Você pode implantar o aplicativo DOM virtual do Oracle JET, que contém um conjunto de arquivos HTML, TypeScript usando os arquivos de sintaxe JSX (TSX) e CSS (Cascading Style Sheets) em qualquer tipo de servidor Web ou de aplicativo. O método de implantação depende do tipo de ambiente de servidor no qual seu aplicativo é executado.

Para implantar o aplicativo DOM virtual do Oracle JET, você pode usar o mesmo método usado para implantar qualquer outra interface do cliente em seu ambiente específico.

O aplicativo DOM virtual que você cria com o comando do pacote de interface de linha de comando do Oracle JET (npx @oracle/ojet-cli create JET-Virtual-DOM-app --template=basic --vdom) contém um diretório de arquivos de modelo de script de gancho que você pode usar para definir novas etapas para o processo de criação. Por exemplo, você pode criar um script hook para arquivar o diretório /web do aplicativo DOM virtual como um arquivo ZIP ou como um arquivo WAR. Este script after_build é executado após a conclusão do processo de build.

Este tutorial não ilustra as etapas de implantação que dependem de um ambiente e uma plataforma específicos.

Objetivos

Neste tutorial, você aprenderá a arquivar o diretório /web do aplicativo DOM virtual como um arquivo ZIP ou WAR. Você também aprende a modificar o aplicativo DOM virtual para automatizar o arquivamento como parte do processo de criação do aplicativo Oracle JET.

Pré-requisitos

Tarefa 1: Criar o Script de Gancho after_build

Você cria o script de hook after_build usando um arquivo de modelo de script de hook fornecido que você modifica.

  1. Navegue até o diretório JET-Virtual-DOM-app/scripts/hooks e abra o arquivo de modelo de script de gancho after_build.js em um editor.

  2. Copie o trecho de código after-build-js.txt e substitua o conteúdo do arquivo de modelo pelo trecho de código copiado.

Tarefa 2: Modificar o Script de Hook after_build

Modifique o script hook para especificar o tipo de arquivo que você deseja gerar para o aplicativo DOM virtual. O script hook usa o mesmo método de compactação para criar o arquivo ZIP e o arquivo WAR. Você modifica o script de gancho after_build para especificar a extensão do arquivo de saída, que é .war por padrão.

  1. No arquivo after_build.js, edite o nome do arquivo informado para fs.createWriteStream() para usar a extensão apropriada: .zip ou .war.
    • Para gerar um arquivo WAR, nomeie o arquivo como my-archive.war.
      const output = fs.createWriteStream('my-archive.war');
      
    • Para gerar um arquivo ZIP, nomeie o arquivo como my-archive.zip.
      const output = fs.createWriteStream('my-archive.zip');
      
  2. Salve o arquivo after_build.js sem alterar o nome do arquivo. Os nomes de arquivo dos scripts de hook no diretório /scripts/hooks correspondem a vários pontos de hook de build do Oracle JET.

Tarefa 3: Criar o Aplicativo no Modo de Liberação

Quando você cria o aplicativo DOM virtual no modo de versão, o comando build --release substitui a versão de desenvolvimento das bibliotecas e scripts no diretório /web/ pelas versões minificadas. Quando o processo de build for concluído, o build executará o script hook after_build e arquivará o conteúdo do diretório /web.

  1. Abra uma janela do terminal, altere o diretório JET-Virtual-DOM-app e instale o pacote npm archiver.

    npm install archiver
    

    Isso instala o pacote npm archiver no projeto JET-Virtual-DOM-app. O gancho after_build.js usa esse pacote para arquivar seu aplicativo DOM virtual.

  2. Abra uma janela de terminal, altere para o diretório JET-Virtual-DOM-app e crie o aplicativo DOM virtual no modo de release.

    npx ojet build web --release
    

    O processo de compilação aciona scripts hook localizados no diretório /scripts/hooks e leva alguns minutos para ser concluído.

  3. Aguarde a confirmação.

    . . .
    Running after_build hook.
    Success: Build finished.
    Files were successfully archived.
    
  4. Navegue até o diretório JET-Virtual-DOM-app e localize o arquivo compactado gerado pelo script hook. Por exemplo, se você tiver modificado o script hook after_build para gerar um arquivo WAR chamado my-archive.war, um arquivo WAR com esse nome aparecerá no diretório raiz do aplicativo.

    Arquivo WAR no diretório raiz de um aplicativo DOM virtual do Oracle JET

Próxima Etapa

Este tutorial conclui o módulo Seu Primeiro Aplicativo Oracle JET Virtual DOM nesta programação de estudo sobre a criação de aplicativos Web DOM virtuais.

Você pode prosseguir para o próximo tutorial na programação de estudo, Criar Contêiner Pai 1 e Componentes do Contêiner da Atividade, no módulo Compor Componentes.

Você também pode retornar à página principal da programação de estudo do DOM virtual para acessar todos os módulos na criação de aplicativos DOM virtuais.

Mais Recursos de Aprendizado

Explore outros laboratórios em docs.oracle.com/learn ou acesse mais conteúdo de aprendizado gratuito no canal do Oracle Learning YouTube. Além disso, acesse education.oracle.com/learning-explorer para se tornar um Oracle Learning Explorer.

Para obter a documentação do produto, visite o Oracle Help Center.