Staging deployment with Bitbucket pipeline and Azure Static Web App

Question

I could successfully deploy my project into the production environment using the provided documentation https://github.com/MicrosoftDocs/azure-docs/blob/main/articles/static-web-apps/bitbucket.md

pipelines:
  branches:
   main:
    - step: 
        name: Deploy to test
        deployment: test
        script:
          - pipe: microsoft/azure-static-web-apps-deploy:main
            variables:
                APP_LOCATION: '$BITBUCKET_CLONE_DIR'
                OUTPUT_LOCATION: '$BITBUCKET_CLONE_DIR/dist'
                API_TOKEN: $deployment_token

But there are no information about how to deploy to other environments than production, e.g: staging, qa, release ... With Azure pipeline, the value can be set with the deployment_environment parameter.

Does anyone have a solution for it?

You mean with the pipe? Well it doesn't support such customisation yet, but there is a recent pull request with such feature https://bitbucket.org/microsoft/azure-static-web-apps-deploy/pull-requests/7 — Randommm, Aug 26 '22 at 09:21

score 0 · Answer 1 · answered Aug 26 '22 at 17:53

Just got this working earlier today. I ran into the same issue, looks like they only support Staging environments when using Github or Azure Pipelines. I was able to get this to work by creating multiple Static Web App resources in Azure Portal. Prod gets the "paid" version, develop branch gets the "free" version.

Here is what the pipelines YAML looks like:

pipelines:
  branches:
   develop:
    - step: 
        name: Deploy to staging
        deployment: staging
        script:
          - pipe: microsoft/azure-static-web-apps-deploy:main
            variables:
                APP_LOCATION: '$BITBUCKET_CLONE_DIR/dist'
                API_TOKEN: $deployment_token_beta
   master:
    - step: 
        name: Deploy to production
        deployment: production
        script:
          - pipe: microsoft/azure-static-web-apps-deploy:main
            variables:
                APP_LOCATION: '$BITBUCKET_CLONE_DIR/dist'
                API_TOKEN: $deployment_token

Then I added a new deployment_token_beta to the repo deployment variables using the key from the second web app

Bhasmang Trivedi · Accepted Answer · 2022-08-27T09:21:55.187

If you are using azure static web apps with multiples slots like prod,staging/dev then you have to specify DEPLOYMENT_ENVIRONMENT in your bitbucket-pipelines.yml file

Example :

pipelines:
  branches:
   develop:
    - step: 
        name: Deploy to staging
        deployment: staging
        script:
          - pipe: microsoft/azure-static-web-apps-deploy:main
            variables:
                APP_LOCATION: '$BITBUCKET_CLONE_DIR/dist'
                API_TOKEN: $deployment_token
                DEPLOYMENT_ENVIRONMENT:Staging
   master:
    - step: 
        name: Deploy to production
        deployment: production
        script:
          - pipe: microsoft/azure-static-web-apps-deploy:main
            variables:
                APP_LOCATION: '$BITBUCKET_CLONE_DIR/dist'
                API_TOKEN: $deployment_token
                DEPLOYMENT_ENVIRONMENT:Prod

If you are using the multiple Static Web App resources then you can follow the answer provided by David Torres, you have to create tokens for each web and mention them in variables.

Thanks & Regards

Staging deployment with Bitbucket pipeline and Azure Static Web App

2 Answers2