0

I created a simple project of Angular with Angular Universal for Server Side Rendering and I am trying to publish it as an Azure App Service in Azure through Azure DevOpds pipelines.

This is my YAML of the pipeline I created :

pool:
  name: Azure Pipelines
steps:
- task: NodeTool@0
  displayName: 'Use Node 12.x'
  inputs:
    versionSpec: 12.x

- task: Npm@1
  displayName: 'Angular CLI'
  inputs:
    command: custom
    workingDir: MySSRSite
    verbose: false
    customCommand: 'install @angular/cli@10.2.0'

- task: Npm@1
  displayName: 'npm install'
  inputs:
    workingDir: MySSRSite
    verbose: false

- task: Npm@1
  displayName: Build
  inputs:
    command: custom
    workingDir: MySSRSite
    verbose: false
    customCommand: 'run build:ssr'

- task: CopyFiles@2
  displayName: 'Copy Files to: MySSRSite/dist/MySSRSite'
  inputs:
    SourceFolder: MySSRSite/dist/MySSRSite/server
    TargetFolder: MySSRSite/dist/MySSRSite

- task: DeleteFiles@1
  displayName: 'Delete files from MySSRSite/dist/MySSRSite/server'
  inputs:
    SourceFolder: MySSRSite/dist/MySSRSite/server
    Contents: '**'
    RemoveSourceFolder: true

- task: ArchiveFiles@2
  displayName: 'Archive MySSRSite/dist/MySSRSite/browser'
  inputs:
    rootFolderOrFile: MySSRSite/dist/MySSRSite/browser

- task: ArchiveFiles@2
  displayName: 'Archive MySSRSite/dist/MySSRSite/main.js'
  inputs:
    rootFolderOrFile: MySSRSite/dist/MySSRSite/main.js

- task: PublishBuildArtifacts@1
  displayName: 'Publish Artifact: drop'

I have connected this pipeline with a Release in Azure DevOps that when the pipeline runs succesfully it automaticaly runs the Release

Release img 1

Release img 2

Release img 3

So these are the settings.

Everything works fine but when I am going to check what is uploaded this is what I get :

Website

And this is what is uplaoded to the Azure App Service :

Azure App Service Files

Is the problem located in the pipeline or in the release ?

EDIT

I have tried to change the pipeline to this :

pool:
  name: Azure Pipelines
steps:
- task: NodeTool@0
  displayName: 'Use Node 12.x'
  inputs:
    versionSpec: 12.x

- task: Npm@1
  displayName: 'Angular CLI'
  inputs:
    command: custom
    workingDir: MySSRSite
    verbose: false
    customCommand: 'install @angular/cli@10.2.0'

- task: Npm@1
  displayName: 'npm install'
  inputs:
    workingDir: MySSRSite
    verbose: false

- task: Npm@1
  displayName: Build
  inputs:
    command: custom
    workingDir: MySSRSite
    verbose: false
    customCommand: 'run build:ssr'

- task: CopyFiles@2
  displayName: 'Copy Files to: MySSRSite/dist/MySSRSite'
  inputs:
    SourceFolder: MySSRSite/dist/MySSRSite/server
    TargetFolder: MySSRSite/dist/MySSRSite

- task: DeleteFiles@1
  displayName: 'Delete files from MySSRSite/dist/MySSRSite/server'
  inputs:
    SourceFolder: MySSRSite/dist/MySSRSite/server
    Contents: '**'
    RemoveSourceFolder: true

- task: ArchiveFiles@2
  displayName: 'Archive MySSRSite/dist/MySSRSite/browser'
  inputs:
    rootFolderOrFile: MySSRSite/dist/MySSRSite/browser
    archiveFile: '_MySSRSite-CI/drop/deploy.zip'

- task: ArchiveFiles@2
  displayName: 'Archive MySSRSite/dist/MySSRSite'
  inputs:
    rootFolderOrFile: MySSRSite/dist/MySSRSite/main.js
    archiveFile: '_MySSRSite-CI/drop/deploy1.zip'

- task: PublishBuildArtifacts@1
  displayName: 'Publish Artifact: drop'
  inputs:
    PathtoPublish: '_MySSRSite-CI/drop'

But still nothing. With this change it just uploads the 2 zip files deploy.zip & deploy1.zip to the Azure App Service.

So there are 2 questions:

  • What am I supposed to upload to Azure App Service ?

  • Is the pipeline format right ?

bad_coder
  • 11,289
  • 20
  • 44
  • 72
statho7
  • 1
  • 1
  • Welcome to Stack Overflow. The error message should be included as text instead of posting it as an image. Please consider these reasons [why you shouldn't upload images of code or error messages](https://meta.stackoverflow.com/questions/285551). – bad_coder Oct 29 '20 at 16:52
  • Hey @bad_coder, I did not posted it as a text as it is just an error 404 there is nothing to copy & paste there ! – statho7 Oct 29 '20 at 18:38
  • My mistake, I came across it on the review queue and didn't notice the 404 under the foreign language. You might want to write out *"got a `404`"* in the text to save readers some wondering... – bad_coder Oct 29 '20 at 18:55
  • You could refer to the Yaml definition in [this ticket](https://stackoverflow.com/a/53632633/13464420). If it couldn't work, can you share your file structure of the zip file? On the other hand, In the screenshot, your error message is not in general language. Can you share it with us after converting it? – Kevin Lu-MSFT Oct 30 '20 at 08:05
  • Is a manual publish from VS working as expected? – Bhargavi Annadevara Oct 31 '20 at 04:36
  • Check [Deploy Angular App Using Azure DevOps Build and Release Pipelines](https://medium.com/better-programming/deploy-angular-app-using-azure-devops-build-and-release-pipelines-f7f77ca28be4) – Bhargavi Annadevara Oct 31 '20 at 04:38

0 Answers0