Azure / Azure/static-web-apps

Bug: AzureStaticWebApp + Azure DevOps + Oryx + Hugo: Undocumented magic is witchcraft

Open
#351 12 comments 0 reactions 0 assignees View on GitHub
Dominant language
No language data
Stars
346
Forks
67
PR merge metrics
No merged PRs in 30d

Description

Hi, please ignore or excuse the title, it describes my situation though.

I'm trying to build a static website (Hugo) to Azure Static Web app, using an Azure Pipeline, because I can't use Github for this (it's a corporate site).

Note: I've spent 2+ hours trying to perform a simple task of deployinh a Hugo website to a static web app, via Azure Pipelines.

I've checked official docs, tutorials, blogs from people; etc. Everything has boiled down to the below:

### Summary

Should we be using static-web-apps with Azure Pipelines? I've just had a poor experience with this.

It's great to create abstractions that make customers' lives easier, but when that magic doesn't work; that magic starts to feel like witchcraft.

### Unclear what AzureStaticWebApp does

I created a pipeline, with a simple chain of bash scripts to build my hugo website. Those tasks pass, but I was surprised to see my pipeline being built the second time with a Microsoft Oryx.

![image](https://user-images.githubusercontent.com/1876878/113720831-4c83fa80-96ef-11eb-922c-3a61043cc92c.png)

Cool, I can remove my hugo bash script thing, and rely on this. Handy!
I however didn't get a clear sense of this, because most tutorials focus on Github Actions.

### Azure Pipelines + Static Web Apps

![image](https://user-images.githubusercontent.com/1876878/113720160-a59f5e80-96ee-11eb-8239-54eac844b780.png)

Literally almost all documentation points one to using SWA with Github Actions.

I understand the popularity, perhaps that the SWA product is meant for people who just want to get a static web thing running in a few minutes, but this product either doesn't work with Azure pipelines, or there's serious documentation gaps.

The above screenshot is me changing a combination of the below:

```yaml
- task: AzureStaticWebApp@0
inputs:
app_location: "/"
app_artifact_location: "public"
output_location: ""
env:
azure_static_web_apps_api_token: $(deployment_token)
```

Here's what I'm trying to express:

* I'm using a Hugo website (detected)
* I haven't changed any configuration to it, so;
* It builds to the default `public` folder
* In that folder, is an `index.html` file
* @ -Azure, please copy that folder, and deploy it.

I haven't been able to find a working combination of `app_location`, `output_location` and the other options.

Interestingly, searching for `AzureStaticWebApp@0` doesn't yield much useful output, but at least I saw #5, which you can close this as a duplicate of.

Now, my observation after exceeding my daily reading time on this, and trying out the various combinations; is that this thing does not work.

Here's some outputs below:

![image](https://user-images.githubusercontent.com/1876878/113722100-640fb300-96f0-11eb-9fdb-c9d171d24aae.png)

![image](https://user-images.githubusercontent.com/1876878/113722258-89042600-96f0-11eb-9f30-ae222eb3b634.png)

Note how the second screenshot tells me about Github ...

(here's me changing stuff cos I don't know what I'm doing anymore)

![image](https://user-images.githubusercontent.com/1876878/113722515-c8327700-96f0-11eb-9249-d3f6862ba0a6.png)

## Proposed Solution

May someone from Microsoft pleasy kindly take a bit of time, to do this (or whatever alternative that can work):

* Deploy a hugo website, and try out the pipeline thing.
* Update the documentation at https://docs.microsoft.com/en-us/azure/static-web-apps/publish-devops, because it does not work. This article was written < 2 weeks ago btw. I started here, and tweaked values until I lost my mind.
* Consider adding some notes about Pipelines + SWA (if the product is intended to be used as such), so that customers' expectations can be better met. I would have gone with a Blob Store static web thingy, or even built the site on a VM, Docker; etc. Plenty of options, but this seemed like the most convenient option. #5 shows some frustration from other customers.
* Consider extending Oryx's functionality to rather detect these config things. If I'm building a Jekyll website, and it does magic to detect that (and build using an old version :thumbs_down:), maybe it should extend the magic to also figuring out where my folders are.
* Consider adding the option (or documenting it) for one to just upload a site (and not build) on Azure Pipelines. I deliberately tried searching for the documentation, but could not find anything. I could otherwise have used my preferred Hugo version, and just uploaded.

For anyone unable to reproduce this, consider the below:

![image](https://user-images.githubusercontent.com/1876878/113724346-8b677f80-96f2-11eb-8808-21583395af99.png)

My reading of it says that my yaml config should be like:

```yaml
- task: AzureStaticWebApp@0
inputs:
app_location: "/" # app is in the root of the repo
output_location: "public" # outputs (should) get built to the public folder
env:
azure_static_web_apps_api_token: $(deployment_token)
```

But I still get the below, and what's this `ss-oryx/app` thing? Is it relevant to my error?

![image](https://user-images.githubusercontent.com/1876878/113724848-0d57a880-96f3-11eb-8f09-46522a0f0b48.png)

Contributor guide

No contributing guide indexed for this repository

Assessment

This issue has not been assessed yet.

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.