演習 - 結果をパイプラインに発行する

10 分

この時点では、パイプラインを使用して Space Game Web プロジェクトをビルドすることができます。

ただ、ビルド結果はどこに保存されるのでしょうか? 現時点では、ビルドの出力は一時ビルドサーバーに残っています。 Mara には、このビルドを Amita に引き継いで、彼女がテストを開始できるようにするための手段が必要です。

ビルド成果物を Azure Pipelines に格納して、ビルドの完了後にチームの他のユーザーが使用できるようにすることができます。ここでは、これを行います。さらに、構成を読みやすくしたり最新の状態に保ったりするために、変数を使用するようにビルド構成をリファクタリングすることもできます。

Note

Azure Pipelines を使用すると、クラウドまたはデータセンターで実行されているテストまたは運用環境に、ビルドされたアプリを自動的にデプロイできます。今のところ、Mara の目標は、既存のプロセスを使用して QA に引き継ぐことができるビルドを作成することだけです。

ビルドをパイプラインに発行する

.NET では、アプリケーションを .zip ファイルとしてパッケージ化できます。その後、組み込み PublishBuildArtifacts@1 タスクを使用して、Azure Pipelines に .zip ファイルを発行できます。

Visual Studio Code で、azure-pipelines.yml を次のように変更します。

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()

このバージョンの azure-pipelines.yml は、以前のバージョンと同じように見えますが、2 つのタスクが追加されています。

最初のタスクでは、DotNetCoreCLI@2 タスクを使用して、アプリのビルド結果 (依存関係を含む) をフォルダーに "公開" (パッケージ化) します。 zipAfterPublish 引数は、ビルドされた結果を .zip ファイルに追加することを指定します。

2 番目のタスクでは、PublishBuildArtifacts@1 タスクを使用して、Azure Pipelines に .zip ファイルを発行します。 condition 引数は、前のタスクが成功した場合にのみタスクを実行することを指定します。 succeeded() は既定の条件であるため、指定する必要はありませんが、ここではその使用方法がわかるように紹介しています。

統合ターミナルから、azure-pipelines.yml をインデックスに追加し、変更をコミットして、GitHub に変更をプッシュします。

ヒント

これらの Git コマンドを実行する前に、必ず azure-pipelines.yml を保存してください。
```
git add azure-pipelines.yml
git commit -m "Add publish tasks"
git push origin build-pipeline
```
以前に行ったように、Azure Pipelines から、ステップごとにビルドをトレースします。
パイプラインが完了したら、ビルドの概要に戻ります。
[関連] に [1 件が公開済み] があります。
成果物を選択します。
格納フォルダーを展開します。

ビルドしたアプリとその依存関係を含む .zip ファイルが表示されます。

オプションの演習を試す場合は、この .zip ファイルをコンピューターにダウンロードし、その内容を調べることができます。

読みやすさを向上させるために変数を定義する

Mara は戻って自分の作業を調べます。このビルド構成なら Mara の希望がかないますが、彼女は、Andy や他の人たちがそれを簡単に最新の状態に保ち、拡張しやすいようにしたいと考えています。

変数を使用すると、値を一度定義して、それらの値をパイプライン全体で参照することができます。パイプラインが実行されたときに、Azure Pipelines によって各変数が現在の値に置き換えられます。

他のプログラミング言語と同様に、変数を使用すると、次のようなことができます。

パイプラインの実行間で変わる可能性がある値を定義する。
バージョン番号やファイルパスなど、パイプライン全体で繰り返される情報を 1 か所に格納する。このようにすれば、自分の箇所を変更するときに、すべての箇所を更新する必要がなくなります。

Azure Pipelines では、多数の組み込み変数が提供されています。これらの変数は、ビルド ID や、ソフトウェアがビルドおよびステージングされるディレクトリの名前など、ビルドプロセスの側面を表します。

独自の変数を定義することもできます。リリースビルド構成を定義する buildConfiguration という名前の変数を示す例を次に示します。

variables:
  buildConfiguration: 'Release'

同じ値を複数回繰り返す場合や、依存関係のバージョンなどの値が変更される可能性がある場合は、変数を使用します。

ビルド構成の一部分ごとに変数を作成する必要はありません。実際には、変数が多すぎると、パイプラインのコードを他のユーザーが読んで理解するのが難しくなる可能性があります。

少し時間を取って、azure-pipelines.yml を調べてみましょう。次の値が繰り返されていることに注意してください。

ビルド構成: Release。
wwwroot ディレクトリの場所: Tailspin.SpaceGame.Web/wwwroot。
.NET SDK バージョン: 6.x。

ここで、変数を使用してこれらの値を 1 回だけ定義します。その後、パイプライン全体で変数を参照します。

Visual Studio Code で、azure-pipelines.yml を次のように変更します。

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()

variables セクションに注意してください。これにより以下の変数が定義されています。

buildConfiguration: ビルド構成を指定します。
wwwrootDir: wwwroot ディレクトリへのパスを指定します。
dotnetSdkVersion: 使用する .NET SDK のバージョンを指定します。

これらの変数を参照するには、組み込み変数の場合と同じように $() 構文を使用します。 node-Sass を実行して Sass ファイルを CSS に変換する手順を次に示します。 wwwroot ディレクトリへのパスを取得するために、wwwrootDir 変数が参照されます。

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

このスクリプトコマンドでは、この変数を使用して、Sass ファイルのソースディレクトリと CSS ファイルを書き込むディレクトリの両方を定義しています。また、この変数を使用して、ユーザーインターフェイスに表示されるタスク名を定義しています。

統合ターミナルから、azure-pipelines.yml をインデックスに追加し、変更をコミットして、GitHub に変更をプッシュします。
```
git add azure-pipelines.yml
git commit -m "Refactor common variables"
git push origin build-pipeline
```
Azure Pipelines から、ステップごとにビルドをトレースします。

ビルドが実行されたときに変数が値に置き換えられていることがわかります。たとえば、使用する .NET SDK のバージョンを設定する UseDotNet@2 タスクを次に示します。

前と同様に、ビルドの完了時に成果物を確認するため、ビルドの概要に移動することができます。

おめでとうございます。これで Azure Pipelines が正常に使用され、最初のビルド成果物が作成されました。

演習 - 結果をパイプラインに発行する

ビルドをパイプラインに発行する

読みやすさを向上させるために変数を定義する

フィードバック