Search code examples
angularnpmyamlazure-pipelinesazure-static-web-app

How to add --force flag to NPM in Azure Pipeline


I've set up an Azure Static Web App, and I've got an Angular 13 web app that I'd like to publish to it. So, I push my git commit to Azure DevOps, and the Azure Pipeline in DevOps (that was automatically created when I created the Static Web App in Azure Portal) gets triggered. So far so good. However, when the pipeline tries to build the app (NPM), it's giving an error. I know that if I force the build, the web app works anyway, and as a temporary solution, this is what I'd like to do. I've been fiddling with the YAML of the Azure Pipeline to try and add the --force flag, but after an entire day, I still cannot get it to work. This is the YAML of the Azure Pipeline:

name: Azure Static Web Apps CI/CD

pr:
  branches:
    include:
      - master
trigger:
  branches:
    include:
      - master

jobs:
- job: build_and_deploy_job
  displayName: Build and Deploy Job
  condition: or(eq(variables['Build.Reason'], 'Manual'),or(eq(variables['Build.Reason'], 'PullRequest'),eq(variables['Build.Reason'], 'IndividualCI')))
  pool:
    vmImage: ubuntu-latest
  variables:
  - group: Azure-Static-Web-Apps-purple-grass-0e645d303-variable-group
  steps:
  - checkout: self
    submodules: true
  - task: AzureStaticWebApp@0
    inputs:
      azure_static_web_apps_api_token: $(AZURE_STATIC_WEB_APPS_API_TOKEN_PURPLE_GRASS_0E645D303)
###### Repository/Build Configurations - These values can be configured to match your app requirements. ######
# For more information regarding Static Web App workflow configurations, please visit: https://aka.ms/swaworkflowconfig
      app_location: "/" # App source code path
      api_location: "" # Api source code path - optional
      output_location: "" # Built app content directory - optional
###### End of Repository/Build Configurations ######

If anyone could point to where I can add the --force flag, I'd be immensely appreciative!

Thanks.


Solution

  • To add --force flag, you can add the custom NPM build command to the field: app_build_command and api_build_command.

    For example:

      - task: AzureStaticWebApp@0
        inputs:
          app_location: '/'
          api_location: 'api'
          app_build_command: 'npm install --force'
          output_location: ''
          api_build_command: 'npm install --force'
          azure_static_web_apps_api_token: $(deployment_token)
    

    For more detailed info, you can refer to this doc: Build configuration for Azure Static Web Apps