Failed to generate Angular Service Proxy into Azure Pipeline build stage

Al Amran 356 Reputation points
2025-07-02T11:36:22.92+00:00

The deployment of an ASP.NET Core application consists of a backend using the ABP framework and a frontend built with Angular, stored in a single repository on Azure DevOps. A YAML pipeline has been configured to deploy both components to separate Azure Web Apps (Windows). The backend app deploys successfully, but the frontend app fails to build and release correctly.

Key Requirement: Before building the Angular app, the proxy must be generated using the ABP CLI. The pipeline does not generate this proxy during execution, which is essential for type safety and IntelliSense support in Angular when handling API calls.

Below is the YAML script configuration for the pipeline:

# ASP.NET

# Build and test ASP.NET projects.
# Add steps that publish symbols, save build artifacts, deploy, and more:

trigger:
  branches:
    include:
      - develop
variables:
  solution: '**/*.sln'
  buildPlatform: 'Any CPU'
  buildConfiguration: 'Release'
  angularDir: 'angular'
  outputDir: 'dist/app'

stages:
- stage: __default
  jobs:
  - job: Job
    pool:
      vmImage: 'windows-latest'
    steps:
    - task: UseDotNet@2
      inputs:
        packageType: 'sdk'
        version: '8.0.x'
        installationPath: $(Agent.ToolsDirectory)/dotnet
      displayName: 'Install .NET 8 SDK'
    - task: NodeTool@0
      inputs:
        versionSpec: '20.x'
      displayName: 'Install Node.js'
    - task: CmdLine@2
      displayName: 'Install Yarn'
      inputs:
        script: |
          npm install -g yarn
        workingDirectory: '$(Build.SourcesDirectory)'
    
    # Run ABP CLI from cmd.exe to generate Angular proxy
    - task: CmdLine@2
      inputs:
        script: |
          cd angular
          echo Installing ABP CLI and generating proxy...
          call dotnet tool install -g Volo.Abp.Cli --version 8.1.2
          abp generate-proxy -t ng -u
      displayName: 'Load ABP Proxy with CLI'
    
    - script: |
        cd angular
        echo "Installing Angular dependencies via npm..."
        ng config -g cli.packageManager yarn
        yarn add @angular/cli
        yarn add install-peers
        ng build --configuration production
      workingDirectory: '$(angularDir)'
      displayName: 'NPM Build Angular App'

      displayName: 'Prepare Artifact for Publishing'
    - task: PublishBuildArtifacts@1
      inputs:
        pathToPublish: '$(Build.ArtifactStagingDirectory)'
        artifactName: 'angular-clientportal'
      displayName: 'Publish Angular Build Artifact'

Azure DevOps
{count} votes

Accepted answer
  1. Durga Reshma Malthi 11,400 Reputation points Microsoft External Staff Moderator
    2025-07-07T08:47:10.0233333+00:00

    Hi Al Amran

    As we discussed in private message, after trying this script - frontend.txt, ABP proxy was successfully generated.

    However, you mentioned: "I can’t see the proxy directory in Azure Repos" "No dist/ClientPortal in the artifact".

    This is expected behavior. Azure Pipelines does not commit generated files back to your Git repository unless you explicitly add a step. So, you won’t see the src/app/proxy folder in Azure Repos, unless you commit it manually.

    Firstly, Open angular/angular.json and look for defaultProject and check if it is missing or set incorrectly.

    Normally it should be like this:

    {
      "$schema": "...",
      "defaultProject": "ClientPortal", // <-- Check this
      "projects": {
        "ClientPortal": {
          "architect": {
            "build": {
              "options": {
                "outputPath": "dist/ClientPortal"  // <-- Confirm this matches your YAML
    

    If your angular.json uses:

    "defaultProject": "app"
    

    Then adjust the build command to:

    call yarn build app --configuration production
    

    then fix in yaml pipeline if needed,

    In your pipeline:

    variables:
      outputDir: 'dist/ClientPortal'
    

    To confirm angular build path, add this debug step:

    - script: |
        echo "Listing Angular build output..."
        dir angular/dist
      displayName: 'Inspect Angular Build Output'
    

    If the folder is angular/dist/client-portal (lowercase or different casing), update your outputDir variable accordingly.

    Hope this helps!

    Please Let me know if you have any queries.


0 additional answers

Sort by: Most helpful

Your answer

Answers can be marked as Accepted Answers by the question author, which helps users to know the answer solved the author's problem.