Angular Azure Pipeline multiple stage

azure-pipelines.yml

trigger: [dev, main]

pr: [dev, main]

pool:
  vmImage: 'ubuntu-latest'

stages:
  - stage: build_dev
    displayName: Build development
    condition: and(always(), eq(variables['Build.SourceBranchName'], 'dev'))
    variables:
      - group: DEV
    jobs:
      - job: DevCI
        steps:
          - script: echo -----CI-----
            displayName: Echo
          - template: templates/include-npm-steps.yml

  - stage: build_prod
    displayName: Build production
    condition: and(always(), eq(variables['Build.SourceBranchName'], 'main'))
    variables:
      - group: PRD
    jobs:
      - job: PrdCI
        steps:
          - script: echo -----CI-----
            displayName: Echo
          - template: templates/include-npm-steps.yml

  - stage: deploy_dev
    displayName: Deploy to development
    dependsOn:
      - build_dev
    variables:
      - group: DEV
    jobs:
      - deployment: DeployWeb
        environment: DEV
        strategy:
          runOnce:
            deploy:
              steps:
                - script: echo -----CD-----
                  displayName: Echo
                - template: templates/include-app-service-steps.yml

  - stage: deploy_prod
    displayName: Deploy to production
    dependsOn:
      - build_prod
    variables:
      - group: PRD
    jobs:
      - deployment: DeployWeb
        environment: PRD
        strategy:
          runOnce:
            deploy:
              steps:
                - script: echo -----CD-----
                  displayName: Echo
                - template: templates/include-app-service-steps.yml

include-app-service-steps.yml

steps:
  - task: AzureRmWebAppDeployment@4
    displayName: Deploy
    inputs:
      ConnectionType: 'AzureRM'
      azureSubscription: '$(Subscription)'
      appType: 'webApp'
      WebAppName: '$(WebAppName)'
      packageForLinux: '$(System.DefaultWorkingDirectory)/**/*.zip'

include-npm-steps.yml

steps:
  - task: NodeTool@0
    displayName: Setup Node.js
    inputs:
      versionSpec: "14.x"
  - task: Cache@2
    displayName: 'Cache npm packages'
    inputs:
      key: 'npm | "$(Agent.OS)" | $(Build.SourcesDirectory)/package-lock.json'
      path: '$(Build.SourcesDirectory)/node_modules'
      cacheHitVar: CacheRestored
  - script: 'npm i'
    displayName: 'Install'
    condition: ne(variables['CacheRestored'], 'true')
  - script: $(CmdBuild)
    displayName: Build
#   - task: CopyFiles@2
#     displayName: Copy File
#     inputs:
#       Contents: 'web.config'
#       TargetFolder: 'dist'
  # - task: replacetokens@3
  #   displayName: Replace Token
  #   inputs:
  #     targetFiles: "$(Pipeline.Workspace)/dist/**/main*.js"
  #     encoding: "auto"
  #     writeBOM: true
  #     verbosity: "detailed"
  #     actionOnMissing: "warn"
  #     keepToken: false
  #     tokenPrefix: "#{"
  #     tokenSuffix: "}#"
  #     useLegacyPattern: false
  #     enableTelemetry: true
  - publish: dist
    displayName: Publish Artifact
    artifact: drop