概要
angularプロジェクトをazure devopsでビルドパイプラインした結果から、リリースパイプラインを動かして、App Serviceにデプロイします。
前提条件
- ビルドパイプラインでビルドしていること
- ランタイムがNode.jsで、Windows環境のApp Serviceが用意されていること
リリースパイプラインの作成
azure devopsのpipelinesのreleasesから、new release pipelineを選択します。
![](http://trelab.info/wp-content/uploads/2023/04/image-16.png)
テンプレートは、Azure App Service deploymentを使います。
![](http://trelab.info/wp-content/uploads/2023/04/image-17-1024x329.png)
Add an artifactの図を選択して、ビルドパイプラインで作っているArtifactを設定します。
![](http://trelab.info/wp-content/uploads/2023/04/image-18-1024x424.png)
次はTaskタブを開いて、azureのsubscriptionとapp service nameを設定します。
リストのプルダウンを押すと自動で、自分のアカウントのサブスクリプションが出ます。
![](http://trelab.info/wp-content/uploads/2023/04/image-19-1024x296.png)
agentのdeploy azure app serviceを選択して、package or folderを変えます。
![](http://trelab.info/wp-content/uploads/2023/04/image-23-1024x294.png)
…のボタンから、ビルドパイプラインで作ったファイルがあるので、Angularプロジェクトのビルド結果であるルートフォルダを選択します。
![](http://trelab.info/wp-content/uploads/2023/04/image-22.png)
以上でリリースパイプラインの設定は完了です。
あとは、saveしてCreate releaseでリリースパイプラインを実行できます。
![](http://trelab.info/wp-content/uploads/2023/04/image-24-1024x230.png)
![](http://trelab.info/wp-content/uploads/2023/04/image-26.png)
デプロイした結果の確認
devopsのreleasesの画面から、リリースパイプラインの実行状況を確認できます。
Stagesが青の状態が実行中で、緑になったら完了です。
![](http://trelab.info/wp-content/uploads/2023/04/image-27-1024x341.png)
デプロイしたapp serviceのURLにアクセスすると、Angularのデフォルトプロジェクトが動いていることが確認できました。
![](http://trelab.info/wp-content/uploads/2023/04/image-28-1024x577.png)