Cvičení – vytvoření kanálu

Dokončeno

V tuto chvíli mara definovala konfiguraci sestavení pro web Space Game . Teď je řada na vás. Vytvoříte kanál a připravíte první artefakt buildu.

Jak jste viděli, Mara použila k definování sestavení soubor YAML. Když vytvoříte kanál, proces vás vyzve k zadání souboru YAML. V projektu tento soubor dosud není.

Pokud pro svůj projekt nezadáte počáteční soubor YAML, azure Pipelines ho může vytvořit za vás na základě typu aplikace. Tady vytvoříte aplikaci ASP.NET Core, ale Azure Pipelines také poskytuje počáteční konfigurace sestavení pro jiné typy projektů, včetně Javy, Go a dalších.

Vytvoření kanálu

  1. V Azure DevOps přejděte do svého projektu.

  2. Na stránce projektu nebo v levém podokně vyberte Kanály.

  3. Vyberte Vytvořit kanál (nebo Nový kanál , pokud se nejedná o první kanál v projektu).

  4. Na kartě Připojení vyberte GitHub.

    Po zobrazení výzvy zadejte své přihlašovací údaje GitHubu.

  5. Na kartě Vybrat vyberte úložiště mslearn-tailspin-spacegame-web.

  6. Pokud chcete nainstalovat aplikaci Azure Pipelines, můžete být přesměrováni na GitHub. Pokud ano, posuňte se dolů a vyberte Schválit a nainstalovat.

  7. Na kartě Konfigurace vyberte ASP.NET Core.

    Poznámka:

    Pokud tuto možnost nevidíte, vyberte Zobrazit více. Nevybírejte ASP.NET Core (.NET Framework).

    Screenshot of locating ASP.NET Core from the list of provided application types.

  8. Na kartě Revize si poznamenejte počáteční konfiguraci sestavení.

    Screenshot of Azure Pipelines showing the initial build configuration.

    Jedná se o velmi základní konfiguraci, kterou azure DevOps poskytuje na základě typu aplikace ASP.NET Core. Výchozí konfigurace používá agenta hostovaného Microsoftem.

    vmImage: ubuntu-latestname: Default Text nahraďte (nebo názvem fondu agentů, pokud jste při nastavování tajných kódů úložiště Codespaces zadali jiný fond).

  9. Na kartě Revize vyberte Uložit a spustit. Pokud chcete potvrdit změny na GitHubu a spustit kanál, zvolte Potvrdit přímo do hlavní větve a vyberte Uložit a spustit podruhé. Pokud se zobrazí výzva k udělení oprávnění s určitou zprávou, jako This pipeline needs permission to access a resource before this run can continueje , zvolte Zobrazit a podle pokynů povolte přístup.

Sledování spuštěného kanálu

V části Úlohy vyberte Možnost Úloha. Dále trasujte proces sestavení jednotlivými kroky. Pokud chcete zobrazit výstup úlohy jako textový soubor po dokončení sestavení, můžete také vybrat Zobrazit nezpracovaný protokol.

Pokud se váš kanál nespustí rychle, ověřte, že codespaces stále běží. Codespaces se po 30 minutách vypne a bude možná potřeba restartovat.

Pokud stav kanálu zůstane ve frontě a po chvíli se nepřevádí na Spuštěno , zkontrolujte paralelní úlohy a požádejte o bezplatné udělení. Pokud nemáte přístup k paralelním úlohám, můžete modul spustit pomocí Codespaces.

Tady uvidíte kroky, které vytvořila definice sestavení. Připraví virtuální počítač, načte nejnovější zdrojový kód z GitHubu a pak aplikaci sestaví.

Screenshot of Azure Pipelines showing output from the initial build configuration.

Tato konfigurace je skvělým startem, protože teď máte místo pro přidání úloh sestavení. Je ale potřeba ho aktualizovat tak, aby vyhovoval potřebám týmu Tailspin, jako je například minifikace souborů JavaScriptu a CSS.

Tip

Zkontrolujte si e-mail. Možná jste již obdrželi oznámení o sestavení s výsledky spuštění. Pomocí těchto oznámení můžete členům týmu dát vědět, kdy se sestavení dokončí a jestli se každé sestavení předalo nebo selhalo.

Přidání úloh sestavení

Teď, když máte funkční proces sestavení, můžete začít přidávat úlohy sestavení.

Mějte na paměti, že pracujete z main větve. Pro uložení práce teď vytvoříte větev s názvem build-pipeline. Větev vám poskytne místo k experimentování a kompletní práci na sestavení, aniž by to ovlivnilo zbytek týmu.

Úlohy sestavení můžete do souboru azure-pipelines.yml přidávat přímo z Azure Pipelines. Azure Pipelines zapisují vaše změny přímo do vaší větve. Tady změníte azure-pipelines.yml místně a nahrajete nebo nahrajete změny do GitHubu. Tímto způsobem si můžete vyzkoušet své dovednosti v Gitu. Sledujte, jak kanál automaticky sestaví aplikaci, když nasdílíte změny.

V praxi můžete přidávat úlohy sestavení po jednom, nasdílat změny a sledovat spuštění sestavení. Tady přidáte všechny úlohy sestavení, které jsme identifikovali dříve.

Poznámka:

Chystáte se spustit několik příkazů Gitu. Nedělejte si starosti, pokud s Gitem začínáte. Ukážeme vám, jak na to. V budoucích modulech se také podíváme na podrobnější informace o Gitu.

  1. V editoru Visual Studio Code přejděte do integrovaného terminálu. Ujistěte se, že ve svém úložišti přejdete do main větve a pak si projdete kroky.

  2. Pokud chcete načíst nejnovější změny z GitHubu a aktualizovat větev, spusťte main tento git pull příkaz.

    git pull origin main
    

    Z výstupu uvidíte, že Git načte soubor s názvem azure-pipelines.yml. Toto je počáteční konfigurace kanálu, kterou pro vás služba Azure Pipelines vytvořila. Když nastavíte kanál, Azure Pipelines tento soubor přidá do úložiště GitHub.

  3. Pokud chcete vytvořit větev s názvem build-pipeline, spusťte tento git checkout příkaz:

    git checkout -B build-pipeline
    
  4. V editoru Visual Studio Code změňte azure-pipelines.yml , jak vidíte tady:

    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'
    

    steps V části uvidíte úlohy sestavení, které se mapují na jednotlivé příkazy skriptu, které jsme identifikovali dříve.

    Azure Pipelines poskytuje integrované úlohy sestavení, které se mapují na řadu běžných aktivit sestavení. Například úloha DotNetCoreCLI@2 se mapuje na nástroj příkazového řádku dotnet. Kanál používá DotNetCoreCLI@2 dvakrát: jednou k obnovení nebo instalaci závislostí projektu a jednou k sestavení projektu.

    Mějte na paměti, že ne všechny aktivity sestavení se mapují na předdefinovaný úkol. Například neexistuje žádná integrovaná úloha, která spouští nástroj node-Sass nebo zapisuje informace o sestavení do textového souboru. Ke spuštění obecných systémových příkazů můžete použít úlohu CmdLine@2 nebo script. Kanál využívá úlohu script, protože se jedná běžnou zkratku pro CmdLine@2.

    V kroku sestavení, který zapisuje informace o sestavení do souboru, si všimněte těchto prvků:

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

    Tyto prvky jsou předdefinované proměnné, které systém poskytuje pro použití ve vašich kanálech:

    • $(Build.DefinitionName) je název kanálu buildu. Například SpaceGame-Web-CI.
    • $(Build.BuildId) je číselný identifikátor dokončeného sestavení, například 115.
    • $(Build.BuildNumber) je název dokončeného sestavení. Formát můžete nakonfigurovat, ale ve výchozím nastavení obsahuje číslo buildu aktuální datum následované číslem buildu pro daný den. Příklad čísla buildu je 20190329.1.

    Můžete také definovat vlastní proměnné, které brzy provedete.

    Možná jste si také všimli UseDotNet@2 úlohy, což je první krok sestavení. Mara si vzpomněla, že skript sestavení nenainstaloval požadované nástroje sestavení. I když se agent sestavení dodává s několika verzemi sady .NET SDK, tato úloha umožňuje autorovi kanálu snadno určit verzi, kterou musí použít v agentovi sestavení.

  5. Z integrovaného terminálu přidejte azure-pipelines.yml do indexu, potvrďte změnu a nasdílíte změnu do GitHubu, spusťte následující příkazy Gitu. Tyto kroky jsou podobné krokům, které jste provedli dříve.

    Tip

    Než tyto příkazy Git spustíte, nezapomeňte uložit azure-pipelines.yml.

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

    Tentokrát nasdílíte na GitHub změny větve build-pipeline, ne větve main.

    Nasdílení změn na GitHub spustí proces sestavení v Azure Pipelines.

  6. V Azure Pipelines přejděte na svůj build. Uděláte to tak, že na straně stránky vyberete Kanály a pak svůj kanál vyberete. Zobrazí se zpráva o potvrzení a že sestavení běží pomocí kódu z build-pipeline větve.

    Screenshot of Azure Pipelines showing the run history, including the branch you recently pushed to GitHub.

    Tip

    Pokud sestavení hned nevidíte, chvíli počkejte nebo aktualizujte stránku.

  7. Vyberte sestavení a zvolte Úlohy a sledujte úlohy sestavení při jejich spuštění.

    Tady je příklad toho, co se stane, když se gulp@1 úloha spustí, aby prováděla úlohy gulp, které minifikují prostředky JavaScriptu a CSS:

    Screenshot of tracing the gulp tasks in Azure Pipelines.

    Pokud některý krok selže, zobrazí se ve výstupu chyba, abyste mohli chybu diagnostikovat a opravit.

    Dříve jste spustili minimální konfiguraci sestavení. Tentokrát se po dokončení sestavení zobrazí sada dokončenějších úloh potřebných k sestavení aplikace.

    Screenshot of Azure Pipelines showing the complete list of build tasks.

  8. Po dokončení sestavení vyberte některý z kroků, abyste viděli celkový průběh sestavení. Odtud můžete přejít na protokoly sestavení nebo související změnu na GitHubu.

    Screenshot of Azure Pipelines showing the complete list of build tasks. The Run gulp task is selected.