This project is an example of using GitHub Actions to automatically deploy a .NET 8 MudBlazor WebAssembly SPA (Single Page Application) to Github Pages. For a live demo, check the following link:
https://mudblazorgithubpages.github.io
Microsoft Docs already contains a general overview of the steps needed for a successful deploy.
- Create a repository based on this template via the "Use this template" button (you don't fork, a fork is for contributing to this template or creating your own template)
- Go to your repository Settings > GitHub Pages > set the source branch to
gh-pages-from-actions
- Set permissions for GitHub Actions
- View your site at https://[
your user name
|your organization name
].github.io
The CI pipelines first perform a normal dotnet publish
of the app, which will generate
a dist
bundle ready to be deployed. This bundle is then pushed differently depending on
the CI environment:
- Azure Pipelines: the bundle is force pushed to
gh-pages
by using raw Git commands - GitHub Actions: an already existing action
is used to push the bundle to
gh-pages-from-actions
The <base>
url in index.html
will need to be modified
depending on where the project is deployed. If deploying on the root level, set
segmentCount = 0
in 404.html
as well.
When testing on localhost, the applicationUrl
for IIS Express in
launchSettings.json
will need to be updated to
reflect the same base url as in index.html
.
Paths in the Azure Pipelines yaml file / GitHub Actions workflow may need to be updated accordingly.
The Azure pipeline is expecting access to one variable group named GitHubPATGroup
, which
should contain the following three variables:
GitHubPAT
: A Personal Access Token with sufficient permission to (force) push to thegh-pages
branchGitHubName
: The name of the user committing to thegh-pages
branchGitHubEmail
: The email of the user committing to thegh-pages
branch
The gh-pages
branch must exist already for the deployment to be successful (this
is a temporary limitation in the pipeline configuration).
In the case of GitHub Actions, only a single secret is needed: ACCESS_TOKEN
, equivalent to GitHubPAT
above. An example of a full deployment using GitHub Actions can also be found in my blazor-fractals repository.