Oefening: het resultaat publiceren naar de pijplijn

Voltooid

Op dit moment kunt u het Space Game-webproject bouwen via de pijplijn.

Maar waar gaan de buildresultaten heen? Op dit moment blijft de uitvoer van de build aanwezig op de tijdelijke buildserver. Mara heeft een manier nodig om deze build aan Amita af te geven, zodat ze kan beginnen met testen.

U kunt buildartefacten opslaan in Azure Pipelines, zodat ze beschikbaar zijn voor anderen in uw team nadat de build is voltooid. Dit is wat u hier doet. Als bonus herstructureert u ook de buildconfiguratie om variabelen te gebruiken om de configuratie gemakkelijker te lezen en up-to-date te houden.

Notitie

Met Azure Pipelines kunt u de ingebouwde app automatisch implementeren in een test- of productieomgeving die wordt uitgevoerd in de cloud of in uw datacenter. Mara's doel is nu alleen om builds te produceren die ze aan QA kan overdragen met behulp van hun bestaande processen.

De build publiceren naar de pijplijn

In .NET kunt u uw app verpakken als een .zip-bestand. Vervolgens kunt u de ingebouwde PublishBuildArtifacts@1 taak gebruiken om het .zip-bestand te publiceren naar Azure Pipelines.

  1. Wijzig in Visual Studio Code azure-pipelines.yml zoals u hier ziet:

    trigger:
    - '*'
    
    pool:
      name: 'Default' #replace if needed with name of your agent pool
    
    steps:
    - task: UseDotNet@2
      displayName: 'Use .NET SDK 6.x'
      inputs:
        version: '6.x'
    
    - task: Npm@1
      displayName: 'Run npm install'
      inputs:
        verbose: false
    
    - script: './node_modules/.bin/node-sass Tailspin.SpaceGame.Web/wwwroot --output Tailspin.SpaceGame.Web/wwwroot'
      displayName: 'Compile Sass assets'
    
    - task: gulp@1
      displayName: 'Run gulp tasks'
    
    - script: 'echo "$(Build.DefinitionName), $(Build.BuildId), $(Build.BuildNumber)" > buildinfo.txt'
      displayName: 'Write build info'
      workingDirectory: Tailspin.SpaceGame.Web/wwwroot
    
    - task: DotNetCoreCLI@2
      displayName: 'Restore project dependencies'
      inputs:
        command: 'restore'
        projects: '**/*.csproj'
    
    - task: DotNetCoreCLI@2
      displayName: 'Build the project - Release'
      inputs:
        command: 'build'
        arguments: '--no-restore --configuration Release'
        projects: '**/*.csproj'
    
    - task: DotNetCoreCLI@2
      displayName: 'Publish the project - Release'
      inputs:
        command: 'publish'
        projects: '**/*.csproj'
        publishWebProjects: false
        arguments: '--no-build --configuration Release --output $(Build.ArtifactStagingDirectory)/Release'
        zipAfterPublish: true
    
    - task: PublishBuildArtifacts@1
      displayName: 'Publish Artifact: drop'
      condition: succeeded()
    
    trigger:
    - '*'
    
    pool:
      vmImage: ubuntu-latest
    
    steps:
    - task: UseDotNet@2
      displayName: 'Use .NET SDK 6.x'
      inputs:
        version: '6.x'
    
    - task: Npm@1
      displayName: 'Run npm install'
      inputs:
        verbose: false
    
    - script: './node_modules/.bin/node-sass Tailspin.SpaceGame.Web/wwwroot --output Tailspin.SpaceGame.Web/wwwroot'
      displayName: 'Compile Sass assets'
    
    - task: gulp@1
      displayName: 'Run gulp tasks'
    
    - script: 'echo "$(Build.DefinitionName), $(Build.BuildId), $(Build.BuildNumber)" > buildinfo.txt'
      displayName: 'Write build info'
      workingDirectory: Tailspin.SpaceGame.Web/wwwroot
    
    - task: DotNetCoreCLI@2
      displayName: 'Restore project dependencies'
      inputs:
        command: 'restore'
        projects: '**/*.csproj'
    
    - task: DotNetCoreCLI@2
      displayName: 'Build the project - Release'
      inputs:
        command: 'build'
        arguments: '--no-restore --configuration Release'
        projects: '**/*.csproj'
    
    - task: DotNetCoreCLI@2
      displayName: 'Publish the project - Release'
      inputs:
        command: 'publish'
        projects: '**/*.csproj'
        publishWebProjects: false
        arguments: '--no-build --configuration Release --output $(Build.ArtifactStagingDirectory)/Release'
        zipAfterPublish: true
    
    - task: PublishBuildArtifacts@1
      displayName: 'Publish Artifact: drop'
      condition: succeeded()
    

    Deze versie van azure-pipelines.yml lijkt op de vorige versie, maar er worden twee extra taken toegevoegd.

    De eerste taak gebruikt de taak om de DotNetCoreCLI@2 buildresultaten van de app (inclusief de bijbehorende afhankelijkheden) in een map te publiceren of in te pakken. Het zipAfterPublish argument geeft aan om de ingebouwde resultaten toe te voegen aan een .zip bestand.

    De tweede taak gebruikt de PublishBuildArtifacts@1 taak om het .zip-bestand te publiceren naar Azure Pipelines. Het condition argument geeft aan om de taak alleen uit te voeren wanneer de vorige taak slaagt. succeeded() is de standaardvoorwaarde, dus u hoeft deze niet op te geven, maar we laten deze hier zien om het gebruik ervan weer te geven.

  2. Voeg vanuit de geïntegreerde terminal azure-pipelines.yml toe aan de index, voer de wijziging door en push de wijziging naar GitHub.

    Tip

    Voordat u deze Git-opdrachten uitvoert, moet u azure-pipelines.yml opslaan.

    git add azure-pipelines.yml
    git commit -m "Add publish tasks"
    git push origin build-pipeline
    
  3. Zoals u eerder hebt gedaan, traceert u de build vanuit Azure Pipelines door elk van de stappen.

  4. Wanneer de pijplijn is voltooid, gaat u terug naar de samenvatting van de build.

  5. Onder Related is er 1 gepubliceerd.

    Screenshot of the build summary. Details include the repository and version, the time started and elapsed, and a link to the published build artifact.Schermopname van de samenvatting van de build. Details zijn onder andere de opslagplaats en versie, de tijd die is gestart en verstreken en een koppeling naar het gepubliceerde build-artefact.

  6. Selecteer het artefact.

  7. Vouw de vervolgkeuzelijst uit.

    U ziet een .zip-bestand met uw ingebouwde app en de bijbehorende afhankelijkheden:

    Screenshot of the packaged web application in the Artifacts explorer.Schermopname van de verpakte webtoepassing in Artifacts Explorer.

    Als u een optionele oefening wilt proberen, kunt u dit .zip-bestand downloaden naar uw computer en de inhoud ervan verkennen.

Variabelen definiëren om de leesbaarheid te verbeteren

Mara stapt terug om haar werk te onderzoeken. De buildconfiguratie doet wat ze nodig heeft, maar ze wil ervoor zorgen dat Andy en anderen deze eenvoudig up-to-date houden en uitbreiden.

Met variabelen kunt u eenmaal waarden definiëren en deze waarden in uw pijplijn raadplegen. Azure Pipelines vervangt elke variabele door de huidige waarde wanneer de pijplijn wordt uitgevoerd.

Net als in andere programmeertalen kunt u met variabelen bijvoorbeeld het volgende doen:

  • Definieer waarden die kunnen veranderen tussen uitvoeringen van uw pijplijn.
  • Sla informatie op die in uw pijplijn wordt herhaald, zoals een versienummer of een bestandspad, op één plaats. Op die manier hoeft u niet alle exemplaren bij te werken wanneer die van u moeten worden gewijzigd.

Azure Pipelines biedt veel ingebouwde variabelen. Deze variabelen beschrijven aspecten van het buildproces, zoals de build-id en de mapnamen waarin uw software is gebouwd en gefaseerd.

U kunt ook uw eigen variabelen definiëren. Hier volgt een voorbeeld van een variabele met de naam buildConfiguration waarmee de buildconfiguratie van de release wordt gedefinieerd:

variables:
  buildConfiguration: 'Release'

Gebruik variabelen wanneer u dezelfde waarde meerdere keren herhaalt of wanneer een waarde, zoals een afhankelijkheidsversie, kan veranderen.

U hoeft geen variabele te maken voor elk deel van uw buildconfiguratie. In feite kunnen te veel variabelen ervoor zorgen dat uw pijplijncode moeilijker kan worden gelezen en begrepen door anderen.

Neem even de tijd om azure-pipelines.yml te bekijken. U ziet dat deze waarden worden herhaald:

  • Buildconfiguratie: Release.
  • Locatie van de wwwroot-map : Tailspin.SpaceGame.Web/wwwroot.
  • .NET SDK-versie: 6.x.

U gebruikt nu variabelen om deze waarden eenmalig te definiëren. Vervolgens verwijst u naar de variabelen in de hele pijplijn.

  1. Wijzig in Visual Studio Code azure-pipelines.yml zoals u hier ziet:

    trigger:
    - '*'
    
    pool:
      name: 'Default' #replace if needed with name of your agent pool
    
    variables:
      buildConfiguration: 'Release'
      wwwrootDir: 'Tailspin.SpaceGame.Web/wwwroot'
      dotnetSdkVersion: '6.x'
    
    steps:
    - task: UseDotNet@2
      displayName: 'Use .NET SDK $(dotnetSdkVersion)'
      inputs:
        version: '$(dotnetSdkVersion)'
    
    - task: Npm@1
      displayName: 'Run npm install'
      inputs:
        verbose: false
    
    - script: './node_modules/.bin/node-sass $(wwwrootDir) --output $(wwwrootDir)'
      displayName: 'Compile Sass assets'
    
    - task: gulp@1
      displayName: 'Run gulp tasks'
    
    - script: 'echo "$(Build.DefinitionName), $(Build.BuildId), $(Build.BuildNumber)" > buildinfo.txt'
      displayName: 'Write build info'
      workingDirectory: $(wwwrootDir)
    
    - task: DotNetCoreCLI@2
      displayName: 'Restore project dependencies'
      inputs:
        command: 'restore'
        projects: '**/*.csproj'
    
    - task: DotNetCoreCLI@2
      displayName: 'Build the project - $(buildConfiguration)'
      inputs:
        command: 'build'
        arguments: '--no-restore --configuration $(buildConfiguration)'
        projects: '**/*.csproj'
    
    - task: DotNetCoreCLI@2
      displayName: 'Publish the project - $(buildConfiguration)'
      inputs:
        command: 'publish'
        projects: '**/*.csproj'
        publishWebProjects: false
        arguments: '--no-build --configuration $(buildConfiguration) --output $(Build.ArtifactStagingDirectory)/$(buildConfiguration)'
        zipAfterPublish: true
    
    - task: PublishBuildArtifacts@1
      displayName: 'Publish Artifact: drop'
      condition: succeeded()
    
    trigger:
    - '*'
    
    pool:
      vmImage: ubuntu-latest
    
    variables:
      buildConfiguration: 'Release'
      wwwrootDir: 'Tailspin.SpaceGame.Web/wwwroot'
      dotnetSdkVersion: '6.x'
    
    steps:
    - task: UseDotNet@2
      displayName: 'Use .NET SDK $(dotnetSdkVersion)'
      inputs:
        version: '$(dotnetSdkVersion)'
    
    - task: Npm@1
      displayName: 'Run npm install'
      inputs:
        verbose: false
    
    - script: './node_modules/.bin/node-sass $(wwwrootDir) --output $(wwwrootDir)'
      displayName: 'Compile Sass assets'
    
    - task: gulp@1
      displayName: 'Run gulp tasks'
    
    - script: 'echo "$(Build.DefinitionName), $(Build.BuildId), $(Build.BuildNumber)" > buildinfo.txt'
      displayName: 'Write build info'
      workingDirectory: $(wwwrootDir)
    
    - task: DotNetCoreCLI@2
      displayName: 'Restore project dependencies'
      inputs:
        command: 'restore'
        projects: '**/*.csproj'
    
    - task: DotNetCoreCLI@2
      displayName: 'Build the project - $(buildConfiguration)'
      inputs:
        command: 'build'
        arguments: '--no-restore --configuration $(buildConfiguration)'
        projects: '**/*.csproj'
    
    - task: DotNetCoreCLI@2
      displayName: 'Publish the project - $(buildConfiguration)'
      inputs:
        command: 'publish'
        projects: '**/*.csproj'
        publishWebProjects: false
        arguments: '--no-build --configuration $(buildConfiguration) --output $(Build.ArtifactStagingDirectory)/$(buildConfiguration)'
        zipAfterPublish: true
    
    - task: PublishBuildArtifacts@1
      displayName: 'Publish Artifact: drop'
      condition: succeeded()
    

    Let op de variables sectie, die deze variabelen definieert:

    • buildConfiguration: Hiermee geeft u de buildconfiguratie op.
    • wwwrootDir: Hiermee geeft u het pad naar de wwwroot-map .
    • dotnetSdkVersion: Hiermee geeft u de .NET SDK-versie op die moet worden gebruikt.

    Als u naar deze variabelen wilt verwijzen, gebruikt u de $() syntaxis net als voor ingebouwde variabelen. Hier volgt de stap waarmee node-Sass wordt uitgevoerd om Sass-bestanden te converteren naar CSS. Als u het pad naar de wwwroot-map wilt ophalen, verwijst deze naar de wwwrootDir variabele.

    - script: './node_modules/.bin/node-sass $(wwwrootDir) --output $(wwwrootDir)'
      displayName: 'Compile Sass assets'
    

    De scriptopdracht maakt gebruik van de variabele voor het definiëren van zowel de bronmap voor Sass-bestanden als de map waarin CSS-bestanden moeten worden geschreven. De variabele wordt ook gebruikt om de taaknaam te definiëren die wordt weergegeven in de gebruikersinterface.

  2. Voeg vanuit de geïntegreerde terminal azure-pipelines.yml toe aan de index, voer de wijziging door en push de wijziging naar GitHub.

    git add azure-pipelines.yml
    git commit -m "Refactor common variables"
    git push origin build-pipeline
    
  3. Volg vanuit Azure Pipelines de build via elk van de stappen.

    U ziet dat de variabelen worden vervangen door hun waarden wanneer de build wordt uitgevoerd. Hier volgt bijvoorbeeld de UseDotNet@2 taak waarmee de .NET SDK-versie wordt ingesteld voor gebruik.

    Screenshot of Azure Pipelines showing the .NET SDK task running in the pipeline.Schermopname van Azure Pipelines met de .NET SDK-taak die wordt uitgevoerd in de pijplijn.

    Net als voorheen kunt u naar het overzicht van de build navigeren om het artefact te zien wanneer de build is voltooid.

Gefeliciteerd U hebt Azure Pipelines gebruikt en uw eerste buildartefact gemaakt.