deploy blazor to github pages

There are two hosting models for Blazor:

  1. Blazor Server
  2. Blazor WebAssembly

Latest is client side model, so it can be hosted as static website, for example in Azure Storage, FireBase, GitHub Pages or other platforms.

It’s easy with GitHub Pages and it’s free.

If you need to deploy there you go to Settings -> GitHub Pages -> Source, but it doesn’t work this way with Blazor.

Although Blazor is client side application, it need to be compiled before deployment.

So I opened project in VS, published to local folder, initialized git repo and published it on GitHub. And you need to add two files to repo: 404.html file with a script that handles redirecting the request to the index.html page. You can take this file here. Also you need to add empty file .nojekyll.

Also you need to add custom domain name, it won’t work without it.

Okay, I did this and it’s working. But it includes several steps to perform when you need to update website.

This is easy way to automate this using GitHub Actions.

And for this we have GitHub Pages Deploy Action on Marketplace.

To create Action you need create .yml file in your repo in folder /.github/workflows/.

As template I used the following example.

And this is my main.yml:

name: Build and Deploy
on: 
    push:
        branches: 
        - master
jobs:
    build-and-deploy:
        runs-on: ubuntu-latest    
        steps:
        - uses: actions/checkout@v1
        - name: Setup .NET Core
          uses: actions/setup-dotnet@v1
          with:
            dotnet-version: 3.1.100
        - name: Publish with dotnet
          run: dotnet publish --configuration Release --output build
        - name: Deploy to Github Pages
          uses: JamesIves/github-pages-deploy-action@releases/v3
          with:
            ACCESS_TOKEN: $
            BASE_BRANCH: master
            BRANCH: gh-pages # The branch the action should deploy to.
            FOLDER: build/BlazorGame/dist # The folder the action should deploy.
            CLEAN: true

How it works: your .NET Core project compiles, creates new branch and the deploy dist folder to this branch.

You just need to add two files 404.html and .nojekyll and setup GitHub Pages options.

But when I did it, it didn’t work as expected: new branch created, but then:

fatal: invalid reference: origin/gh-pages-people
The deployment encountered an error.

Easy fix for this: just do another commit and deployment is sucsessfull to already existed branch.

And other comment: branch name should be exactly gh-pages, only in this case you can publish GitHub Pages.

And now my site is up and running.

Written on December 26, 2019