CODEWITHSUNDEEP
angularazureazure-devopsstatic
Matthew Watts
Matthew Watts

Reputation: 13

Azure Dev Ops Deploying Angular Application To Static Web App

I want to deploy an Angular application to an Azure Static Web Application.The build part works fine but the release errors and says it can not find the build artifact : Directory Location: 'dist' is invalid. Could not detect this directory. Please verify your deployment configuration file reflects your repository structure.

This is the YAML used for the application publish, screenshot below that.

steps:
- task: PublishBuildArtifacts@1
  displayName: 'Publish Artifact: dist'
  inputs:
    PathtoPublish: dist
    ArtifactName: dist

Static Web App templete

So it seems that we are not using the correct publish location but not sure what to use.

The following is the YAML from the pipeline :

steps:
- task: Npm@1
  displayName: 'npm custom'
  inputs:
    command: custom
    verbose: false
    customCommand: 'install @angular/cli -g'

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

steps:
- task: Npm@1
  displayName: 'npm build'
  inputs:
    command: custom
    verbose: false
    customCommand: 'run build -- --configuration=production'

steps:
- task: PublishBuildArtifacts@1
  displayName: 'Publish Artifact: dist'
  inputs:
    PathtoPublish: dist/CarehomeBooking
    ArtifactName: dist

The directory structure of the built Angular app is :

AngularBuiltCode

Upvotes: 0

Views: 982

Answers (1)

rickvdbosch
rickvdbosch

Reputation: 15621

The PathToPublish needs to have the output folder of the ng build action. Please make sure to build a release version of your project. You might need to run either ng build --prod, ng build --configuration production or simply ng build to make sure you build a release version depending on what version of Angular (CLI) you are on.

The default output path for current Angular projects is: dist/<projectName>

Find your output path by opening up the angular.json file and looking at the outputPath under architect -> build -> options.

Also: make sure you run the command from the root of the project or specify the full path.

Upvotes: 2

Related Questions