Automating Hugo Deployment Flow with GitHub Actions and Firebase Hosting

Fig-1 The Deploy Flow

Here I create a workflow of GitHub Actions like Fig-1.

Trigger

Pushing to main branch triggers the workflow.

'on':
  push:
    branches:
      - main

Checkout

I manage the theme of Hugo with submodules of Git, so set the submodules option true.

jobs:
  build_and_deploy:
    runs-on: ubuntu-latest
    steps:
      - uses: actions/checkout@v2
        with:
          submodules: true
          fetch-depth: 0

Building static Web pages

Build static Web pages with Hugo using peaceiris/actions-hugo. By default of Hugo, the files are created under public directory.

      - name: Setup Hugo
        uses: peaceiris/actions-hugo@v2
        with:
          hugo-version: "0.83.1"
      - name: Build
        run: hugo --minify

If you set the directory other than public, you have to change the deployment setting which I explain later. Or maybe you could change it to public directory.

Deployment to Firebase Hosting

Deploy the generated Web pages to Firebase Hosting. By default, public directory is deployed. You have to match the directory setting of Hugo.

      - uses: FirebaseExtended/action-hosting-deploy@v0
        with:
          repoToken: '${{ secrets.GITHUB_TOKEN }}'
          firebaseServiceAccount: '${{ secrets.YOUR_SERVICE_ACCOUNT_HERE }}'
          channelId: live
          projectId: your-project-id-here
        env:
          FIREBASE_CLI_PREVIEWS: hostingchannels

The step is automatically generated by Firebase CLI. The instruction is probided in “Deploy to live & preview channels via GitHub pull requests”. I used version 9.10.0 of Firebase CLI. If you using old version of Firebase CLI, there is no command to generate GitHub Actions' workflow.

Pushing to GitHub

Now the Hugo generated static Web pages are deployed to Firebase Hosting when you push the project to main.

References

  1. Deploy to live & preview channels via GitHub pull requests  |  Firebase
  2. peaceiris/actions-hugo: GitHub Actions for Hugo ⚡️ Setup Hugo quickly and build your site fast. Hugo extended, Hugo Modules, Linux (Ubuntu), macOS, and Windows are supported.

About me

Experienced software developer. Technical lead at Fuller, Inc. My speciality is developing Android native app. I'm living in Tsukuba Japan, with my family, dogs, and cats :)

Here is more detailed profile.