How do I locate my staticwebapp.config.json in Azure Devops release Deploy Azure Static Web App?

Question

I have a pipeline that builds the artificat for my Angular app. Deployment works fine until I try to go to specific URLs. It redirects me to 404. This has to do with the staticwebapp.config.json. It looks like:

{
  "navigationFallback": {
    "rewrite": "/index.html",
    "exclude": ["*.{css,scss,js,png,gif,ico,jpg,svg}"]
  }
}

I have a created a release pipeline in Azure Devops to release it to my Static Web App on Azure. This is how my .yaml looks like:

steps:
- task: AzureStaticWebApp@0
  displayName: 'Static Web App: '
  inputs:
    workingDirectory: '$(System.DefaultWorkingDirectory)/xx/xx/xx-xx-web'
    app_location: /
    output_location: dist
    config_file_location: configuration
    skip_app_build: true
    skip_api_build: true
    is_static_export: false
    verbose: true
    azure_static_web_apps_api_token: 'SOMEVALUE'

The staticwebapp.config.json is located here:

src
- app
- assets
- configuration
  - staticwebapp.config.json

This is the error I get during the release:

##[error]routes_location: route file 'staticwebapp.config.json/routes.json' could not be found.

or when I fill in the config_file_location:

##[error]config_file_location: config file '/configuration/staticwebapp.config.json' could not be found.

How do I locate the file?

score 5 · Accepted Answer · answered Aug 31 '22 at 12:44

This problem is solved. I did the following:

The staticwebapp.config.json file should be in the built artifact that comes out of the build pipeline. And this file was nowhere to be found. What I did, was putting the config file in the assets folder, because this folder is completely being taken over during the build. This piece of configuration in the angular.json file in your solution takes care of that:

"assets": [
 "src/favicon.ico",
 "src/assets"
]

It takes over everything inside the assets folder. You can also put the exact location in this assets array, but I kept it simple. After a new build, I saw the staticwebapp.config.json appearing in the built artifact in the assets folder.

My .yaml for deploying it to Azure Static Web App now looks like this below:

steps:
- task: AzureStaticWebApp@0
  displayName: 'Static Web App: '
  inputs:
    workingDirectory: '$(System.DefaultWorkingDirectory)/xx/xx/xx-xx-web'
    app_location: /
    output_location: dist
    config_file_location: /assets
    skip_app_build: true
    skip_api_build: true
    is_static_export: false
    verbose: true
    azure_static_web_apps_api_token: 'SOMEVALUE'

This was helpful, I did not have to set a `config_file_location` doing so resulted in "config_file_location: config file '/assets/staticwebapp.config.json' could not be found." I did elect to add `src/azure` to the angular.json assets which was a good place to organize the `staticwebapp.config.json` and associated `environment.yml` files — Tyler V, Jan 11 '23 at 22:08
As @TylerV mentioned i had got an error and had to mention ```config_file_location: src/assets``` — Ashique Razak, Aug 09 '23 at 15:42

score 0 · Answer 2 · answered Aug 30 '22 at 05:25

If you define the working directory as '$(System.DefaultWorkingDirectory)/xx/xx/xx-xx-web' in task: AzureStaticWebApp@0. Then it will try to locate your staticwebapp.config.json in this directory.

I have modified your script. You could have a test.

steps:
- task: AzureStaticWebApp@0
  displayName: 'Static Web App: '
  inputs:
    app_location: /
    output_location: 'dist'
    config_file_location: '/src'
    skip_app_build: true
    skip_api_build: true
    is_static_export: false
    verbose: true
    azure_static_web_apps_api_token: 'SOMEVALUE'

Check this link for the arguments: https://learn.microsoft.com/en-us/azure/devops/pipelines/tasks/utility/azure-static-web-app?view=azure-devops#arguments

It didn't work, same error. It can't find the json file. I was looking in my working directory and the artifact that the build has produced, I also don't see any staticwebapp.config.json file inside. Is that right? — A. Gh, Aug 31 '22 at 07:01

How do I locate my staticwebapp.config.json in Azure Devops release Deploy Azure Static Web App?

2 Answers2