Configurar a integração contínua para seu aplicativo WinUI 3

  • Artigo

Você pode usar GitHub Actions para configurar builds de integração contínua para projetos winUI 3. Neste artigo, vamos analisar diferentes maneiras de fazer isso. Também mostraremos como realizar essas tarefas usando a linha de comando para que seja possível fazer a integração com qualquer sistema de build.

Pré-requisitos

Etapa 1: Configurar seu certificado

Os aplicativos MSIX devem estar conectados para serem instalados. Se você já tiver um certificado, poderá ignorar esta etapa. Você pode facilmente criar um certificado de teste abrindo seu aplicativo no Visual Studio, clicando com o botão direito do mouse em seu projeto WinUI 3 e selecionando Pacote e Publicar ->Criar Pacotes de Aplicativos.

Em seguida, selecione Avançar para ir para a página Selecionar método de assinatura e clique no botão Criar... para criar um novo certificado. Escolha o nome do editor e deixe o campo de senha em branco e crie o certificado.

Em seguida, feche/cancele as caixas de diálogo e observe que um novo arquivo .pfx foi criado em seu projeto. Esse é o certificado com o qual você pode assinar seu MSIX!

Etapa 2: Adicionar seu certificado aos segredos do Actions

Se possível, você deve evitar enviar certificados para o seu repositório e o git os ignorará por padrão. Para gerenciar o tratamento seguro de arquivos confidenciais, como certificados, o GitHub dá suporte a segredos.

Para carregar um certificado em seu build automatizado:

  1. Codifique o certificado como uma cadeia de caracteres base 64: abra o PowerShell no diretório que contém o certificado e execute o comando a seguir, substituindo o nome do arquivo pfx pelo nome do arquivo do certificado.
$pfx_cert = Get-Content 'App1_TemporaryKey.pfx' -AsByteStream

[System.Convert]::ToBase64String($pfx_cert) | Out-File 'App1_TemporaryKey_Base64.txt'
  1. No repositório GitHub, vá para a página Configurações e clique em Segredos à esquerda.
  2. Clique em Novo segredo do repositório, nomeie-o BASE64_ENCODED_PFXe copie/cole o texto do arquivo de texto na saída do PowerShell para o valor do segredo.

Etapa 3: configurar seu fluxo de trabalho

Em seguida, no repositório, vá para a guia Ações e crie um novo fluxo de trabalho. Escolha a opção configurar um fluxo de trabalho por conta própria em vez de um dos modelos de fluxo de trabalho.

Copie/cole o seguinte no arquivo de fluxo de trabalho e atualize...

  1. Solution_Name para o nome da solução
  2. dotnet-version para 5.0 ou 6.0, dependendo do seu projeto

Observação

Para a etapa que carrega o artefato (a última etapa abaixo), se a saída de build não chegar em uma pasta que contém sua solução, substitua env.Solution_Namegithub.workspace por (a pasta Workspace do GitHub Actions).

# This workflow will build, sign, and package a WinUI 3 MSIX desktop application
# built on .NET.

name: WinUI 3 MSIX app

on:
  push:
    branches: [ main ]
  pull_request:
    branches: [ main ]

jobs:

  build:

    strategy:
      matrix:
        configuration: [Release]
        platform: [x64, x86]

    runs-on: windows-latest  # For a list of available runner types, refer to
                             # https://help.github.com/en/actions/reference/workflow-syntax-for-github-actions#jobsjob_idruns-on

    env:
      Solution_Name: your-solution-name                         # Replace with your solution name, i.e. App1.sln.

    steps:
    - name: Checkout
      uses: actions/checkout@v2
      with:
        fetch-depth: 0

    # Install the .NET Core workload
    - name: Install .NET Core
      uses: actions/setup-dotnet@v1
      with:
        dotnet-version: 6.0.x

    # Add  MSBuild to the PATH: https://github.com/microsoft/setup-msbuild
    - name: Setup MSBuild.exe
      uses: microsoft/setup-msbuild@v1.0.2

    # Restore the application to populate the obj folder with RuntimeIdentifiers
    - name: Restore the application
      run: msbuild $env:Solution_Name /t:Restore /p:Configuration=$env:Configuration
      env:
        Configuration: ${{ matrix.configuration }}

    # Decode the base 64 encoded pfx and save the Signing_Certificate
    - name: Decode the pfx
      run: |
        $pfx_cert_byte = [System.Convert]::FromBase64String("${{ secrets.BASE64_ENCODED_PFX }}")
        $certificatePath = "GitHubActionsWorkflow.pfx"
        [IO.File]::WriteAllBytes("$certificatePath", $pfx_cert_byte)

    # Create the app package by building and packaging the project
    - name: Create the app package
      run: msbuild $env:Solution_Name /p:Configuration=$env:Configuration /p:Platform=$env:Platform /p:UapAppxPackageBuildMode=$env:Appx_Package_Build_Mode /p:AppxBundle=$env:Appx_Bundle /p:PackageCertificateKeyFile=GitHubActionsWorkflow.pfx /p:AppxPackageDir="$env:Appx_Package_Dir" /p:GenerateAppxPackageOnBuild=true
      env:
        Appx_Bundle: Never
        Appx_Package_Build_Mode: SideloadOnly
        Appx_Package_Dir: Packages\
        Configuration: ${{ matrix.configuration }}
        Platform: ${{ matrix.platform }}

    # Remove the pfx
    - name: Remove the pfx
      run: Remove-Item -path GitHubActionsWorkflow.pfx

    # Upload the MSIX package: https://github.com/marketplace/actions/upload-a-build-artifact
    - name: Upload MSIX package
      uses: actions/upload-artifact@v2
      with:
        name: MSIX Package
        path: ${{ env.Solution_Name }}\\Packages

Etapa 4: Confirme o fluxo de trabalho e watch-o ser executado!

Confirme o arquivo de fluxo de trabalho no branch main e vá para a guia Ações no repositório GitHub e watch sua execução de fluxo de trabalho! Ele deve ser executado com êxito e produzir artefatos que contenham seu aplicativo MSIX criado.

Compilação na linha de comando

Se você quiser criar sua solução usando a linha de comando ou usando qualquer outro sistema de CI, execute o MSBuild com esses argumentos. A GenerateAppxPackageOnBuild propriedade faz com que o pacote MSIX seja gerado.

/p:AppxPackageDir="Packages"
/p:UapAppxPackageBuildMode=SideloadOnly
/p:AppxBundle=Never
/p:GenerateAppxPackageOnBuild=true

Etapa 1: Configurar seu fluxo de trabalho

No repositório GitHub, vá para a guia Ações e crie um novo fluxo de trabalho. Escolha a opção configurar um fluxo de trabalho por conta própria em vez de um dos modelos de fluxo de trabalho.

Copie/cole o seguinte no arquivo de fluxo de trabalho e atualize...

  1. Solution_Name para o nome da solução
  2. dotnet-version para 5.0 ou 6.0, dependendo do seu projeto

Observação

Para a etapa que carrega o artefato (a última etapa abaixo), se a saída de build não chegar em uma pasta que contém sua solução, substitua env.Solution_Namegithub.workspace por (a pasta Workspace do GitHub Actions).

# This workflow will build and publish a WinUI 3 unpackaged desktop application
# built on .NET.

name: WinUI 3 unpackaged app

on:
  push:
    branches: [ main ]
  pull_request:
    branches: [ main ]

jobs:

  build:

    strategy:
      matrix:
        configuration: [Release]
        platform: [x64, x86]

    runs-on: windows-latest  # For a list of available runner types, refer to
                             # https://help.github.com/en/actions/reference/workflow-syntax-for-github-actions#jobsjob_idruns-on

    env:
      Solution_Name: your-solution-name                         # Replace with your solution name, i.e. App1.sln.

    steps:
    - name: Checkout
      uses: actions/checkout@v2
      with:
        fetch-depth: 0

    # Install the .NET Core workload
    - name: Install .NET Core
      uses: actions/setup-dotnet@v1
      with:
        dotnet-version: 6.0.x

    # Add  MSBuild to the PATH: https://github.com/microsoft/setup-msbuild
    - name: Setup MSBuild.exe
      uses: microsoft/setup-msbuild@v1.0.2

    # Restore the application to populate the obj folder with RuntimeIdentifiers
    - name: Restore the application
      run: msbuild $env:Solution_Name /t:Restore /p:Configuration=$env:Configuration
      env:
        Configuration: ${{ matrix.configuration }}

    # Create the app by building and publishing the project
    - name: Create the app
      run: msbuild $env:Solution_Name /t:Publish /p:Configuration=$env:Configuration /p:Platform=$env:Platform
      env:
        Configuration: ${{ matrix.configuration }}
        Platform: ${{ matrix.platform }}

    # Upload the app
    - name: Upload app
      uses: actions/upload-artifact@v2
      with:
        name: Upload app
        path: ${{ env.Solution_Name }}\\bin

Etapa 2: Confirme o fluxo de trabalho e watch-o ser executado!

Confirme o arquivo de fluxo de trabalho no branch main e vá para a guia Ações no repositório GitHub e watch sua execução de fluxo de trabalho! Ele deve ser executado com êxito e produzir artefatos que contenham seu aplicativo criado.

Compilação na linha de comando

Se você quiser criar sua solução usando a linha de comando ou usando qualquer outro sistema de CI, execute o MSBuild com o /t:Publish argumento .