Övning – Skapa pipelinen

Slutförd

Nu har Mara definierat en byggkonfiguration för webbplatsen Space Game . Nu är det din tur; du ska skapa en pipeline och skapa din första byggartefakt.

Som du såg använde Mara en YAML-fil för att definiera bygget. När du skapar en pipeline uppmanas du att ange YAML-filen. Projektet har inte den här filen ännu.

När du inte anger någon första YAML-fil för projektet kan Azure Pipelines skapa en för dig baserat på din apptyp. Här skapar du en ASP.NET Core-app, men Azure Pipelines tillhandahåller även startversionskonfigurationer för andra projekttyper, inklusive Java, Go med mera.

Skapa pipelinen

  1. I Azure DevOps går du till projektet.

  2. Välj Pipelines på projektsidan eller i den vänstra rutan.

  3. Välj Skapa pipeline (eller Ny pipeline om det inte är den första pipelinen i projektet).

  4. På fliken Anslut väljer du GitHub.

    Ange dina autentiseringsuppgifter för GitHub när du uppmanas att göra det.

  5. På fliken Välj väljer du lagringsplatsen mslearn-tailspin-spacegame-web .

  6. Om du vill installera Azure Pipelines-appen kan du omdirigeras till GitHub. I så fall bläddrar du längst ned och väljer Godkänn och installera.

  7. På fliken Konfigurera väljer du ASP.NET Core.

    Kommentar

    Om du inte ser det här alternativet väljer du Visa mer. Välj inte ASP.NET Core (.NET Framework).

    Skärmbild av att hitta ASP.NET Core från listan över angivna programtyper.

  8. På fliken Granska noterar du den första byggkonfigurationen.

    Skärmbild av Azure Pipelines som visar den första byggkonfigurationen.

    Det här är en mycket grundläggande konfiguration som Azure DevOps tillhandahåller baserat på din apptyp ASP.NET Core. Standardkonfigurationen använder en Microsoft-värdbaserad agent.

    Ersätt texten vmImage: ubuntu-latest med name: Default (eller namnet på agentpoolen om du angav en annan pool när du konfigurerade codespaces-lagringsplatsens hemligheter).

  9. På fliken Granska väljer du Spara och kör. Om du vill checka in ändringarna på GitHub och starta pipelinen väljer du Checka in direkt till huvudgrenen och väljer Spara och kör en andra gång. Om du uppmanas att bevilja behörighet med ett meddelande som This pipeline needs permission to access a resource before this run can continueväljer du Visa och följer anvisningarna för att tillåta åtkomst.

Titta på pipelinekörningen

Under Jobb väljer du Jobb. Spåra sedan byggprocessen genom vart och ett av stegen. Om du vill se jobbutdata som en textfil när bygget är klart kan du också välja Visa rålogg.

Om pipelinen inte startar snabbt kontrollerar du att Codespaces fortfarande körs. Codespaces stängs av efter 30 minuter och kan behöva startas om.

Om din pipelinestatus förblir köad och inte övergår till Körs efter en liten stund kontrollerar du dina parallella jobb och begär ett kostnadsfritt beviljande. Om du inte har åtkomst till parallella jobb kan du starta modulen med Codespaces.

Här ser du stegen som byggdefinitionen skapade. Den förbereder den virtuella datorn, hämtar den senaste källkoden från GitHub och skapar sedan appen.

Skärmbild av Azure Pipelines som visar utdata från den första byggkonfigurationen.

Den här konfigurationen är en bra start eftersom du nu har en plats där du kan lägga till bygguppgifter. Du behöver fortfarande uppdatera den för att uppfylla tailspin-teamets behov, till exempel för att minimera JavaScript- och CSS-filer.

Dricks

Kontrollera din e-post. Du kanske redan har fått ett byggmeddelande med resultatet av körningen. Du kan använda dessa meddelanden för att meddela dina teammedlemmar när byggena har slutförts och om varje bygge har godkänts eller misslyckats.

Lägga till bygguppgifter

Nu när du har en fungerande byggprocess kan du börja lägga till bygguppgifter.

Kom ihåg att du arbetar från grenen main . Om du vill behålla ditt arbete skapar du nu en gren med namnet build-pipeline. Grenen ger dig en plats där du kan experimentera och få bygget att fungera helt utan att påverka resten av teamet.

Du kan lägga till bygguppgifter i azure-pipelines.yml direkt från Azure Pipelines. Azure Pipelines checkar in ändringarna direkt till din gren. Här ändrar du azure-pipelines.yml lokalt och push-överför dina ändringar till GitHub. Om du gör det på det här sättet kan du öva dina Git-kunskaper. Se hur pipelinen automatiskt skapar appen när du push-överför ändringar.

I praktiken kan du lägga till bygguppgifter en i taget, push-överföra ändringarna och titta på byggkörningen. Här lägger du till alla bygguppgifter som vi identifierade tidigare på en gång.

Kommentar

Du ska köra några Git-kommandon. Oroa dig inte om du är nybörjare på Git. Vi visar dig vad du behöver göra. Vi går också in närmare på Git i framtida moduler.

  1. I Visual Studio Code går du till den integrerade terminalen. Se till att du går till -grenen main på lagringsplatsen och gå sedan igenom stegen.

  2. Kör det här git pull kommandot för att hämta de senaste ändringarna från GitHub och uppdatera din main gren.

    git pull origin main
    

    Du ser från utdata att Git hämtar en fil med namnet azure-pipelines.yml. Det här är den startpipelinekonfiguration som Azure Pipelines skapade åt dig. När du konfigurerar pipelinen lägger Azure Pipelines till den här filen till din GitHub-lagringsplats.

  3. Om du vill skapa en gren med namnet build-pipelinekör du det här git checkout kommandot:

    git checkout -B build-pipeline
    
  4. I Visual Studio Code ändrar du azure-pipelines.yml som du ser här:

    trigger:
    - '*'
    
    pool:
      name: 'Default' # Replace Default with the name of your agent pool if you used a different pool
    
    variables:
      buildConfiguration: 'Release'
    
    steps:
    - task: UseDotNet@2
      displayName: 'Use .NET SDK 6.x'
      inputs:
        packageType: sdk
        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'
    
    trigger:
    - '*'
    
    pool:
      vmImage: ubuntu-latest
    
    variables:
      buildConfiguration: 'Release'
    
    steps:
    - task: UseDotNet@2
      displayName: 'Use .NET SDK 6.x'
      inputs:
        packageType: sdk
        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'
    

    I avsnittet steps visas de bygguppgifter som mappas till vart och ett av de skriptkommandon som vi identifierade tidigare.

    Azure Pipelines tillhandahåller inbyggda bygguppgifter som mappar till många vanliga byggaktiviteter. Till exempel mappar uppgiften DotNetCoreCLI@2 till kommandoradsverktyget dotnet. Pipelinen använder DotNetCoreCLI@2 två gånger: en gång för att återställa eller installera projektets beroenden och en gång för att skapa projektet.

    Kom ihåg att inte alla byggaktiviteter mappas till en inbyggd uppgift. Det finns till exempel ingen inbyggd uppgift som kör verktyget node-Sass eller skriver bygginformation till en textfil. Om du vill köra allmänna systemkommandon använder du uppgiften CmdLine@2 eller script. Pipelinen använder uppgiften script eftersom den är en vanlig genväg för CmdLine@2.

    Observera följande element i byggsteget som skriver information om bygget till en fil:

    • $(Build.DefinitionName)
    • $(Build.BuildId)
    • $(Build.BuildNumber)

    Dessa element är inbyggda variabler som systemet tillhandahåller för användning i dina pipelines:

    • $(Build.DefinitionName) är namnet på bygg-pipelinen. Till exempel "SpaceGame-Web-CI".
    • $(Build.BuildId) är en numerisk identifierare för den färdiga versionen, till exempel 115.
    • $(Build.BuildNumber) är namnet på den färdiga versionen. Du kan konfigurera formatet, men som standard innehåller versionsnumret det aktuella datumet följt av versionsnumret för den dagen. Ett exempel på versionsnummer är "20190329.1".

    Du kan också definiera dina egna variabler, vilket du kommer att göra snart.

    Du kanske också har lagt märke till UseDotNet@2 uppgiften, vilket är det första byggsteget. Mara kom ihåg att byggskriptet inte installerade de nödvändiga byggverktygen. Även om byggagenten levereras med flera .NET SDK-versioner kan pipelineförfattaren enkelt ange vilken version de behöver använda på byggagenten.

  5. Från den integrerade terminalen kör du följande Git-kommandon för att lägga till azure-pipelines.yml i indexet, checka in ändringen och push-överföra ändringen till GitHub. De här stegen liknar de steg som du utförde tidigare.

    Dricks

    Kom ihåg att spara azure-pipelines.yml innan du kör de här Git-kommandona.

    git add azure-pipelines.yml
    git commit -m "Add build tasks"
    git push origin build-pipeline
    

    Den här gången skickar du build-pipeline-grenen, inte main-grenen, till GitHub.

    När du skickar grenen till GitHub utlöses byggprocessen i Azure Pipelines.

  6. I Azure Pipelines går du till din version. Det gör du genom att välja Pipelines på sidans sida och sedan din pipeline. Du ser ditt incheckningsmeddelande och att bygget körs med hjälp av koden från grenen build-pipeline .

    Skärmbild av Azure Pipelines som visar körningshistoriken, inklusive den gren som du nyligen skickade till GitHub.

    Dricks

    Om du inte ser bygget på en gång väntar du en stund eller uppdaterar sidan.

  7. Välj din version och välj Jobb och spåra bygguppgifterna när de körs.

    Här är till exempel vad som händer när gulp@1 uppgiften körs för att utföra de gulp-uppgifter som minimerar JavaScript- och CSS-tillgångar:

    Skärmbild av spårning av gulp-uppgifter i Azure Pipelines.

    Om något steg misslyckas visas felet i utdata så att du kan diagnostisera och åtgärda felet.

    Tidigare körde du en mer minimal byggkonfiguration. Den här gången visas en mer fullständig uppsättning uppgifter som behövs för att skapa appen när bygget är klart.

    Skärmbild av Azure Pipelines som visar den fullständiga listan över bygguppgifter.

  8. När bygget är klart väljer du något av stegen för att se den övergripande utvecklingen av bygget. Därifrån kan du hoppa till byggloggarna eller den associerade ändringen på GitHub.

    Skärmbild av Azure Pipelines som visar den fullständiga listan över bygguppgifter. Uppgiften Kör gulp är markerad.