GreenMeeple

Methods to Deploy Hexo to GitHub.io

Assume you’ve created a repository on GitHub called <username>.github.io. Here are two common method you can deploy you Hexo Blog:

Hexo Command

Hexo’s documentations and Tutorial has provided sufficient instructions on deploying your personal website on your GitHub repository.

According to the Hexo Tutorial, we can deploy the repository by using GitHub Actions.

1. Create and Add the following contents to .github/workflows/pages.yml:

.github/workflows/pages.yml

name: Pages

on:
push:
    branches:
    - main # default branch

jobs:
build:
    runs-on: ubuntu-latest
    steps:
    - uses: actions/checkout@v4
        with:
        token: $
        submodules: recursive
    - name: Use Node.js 20
        uses: actions/setup-node@v4
        with:
        # Examples: 20, 18.19, >=16.20.2, lts/Iron, lts/Hydrogen, *, latest, current, node
        # Ref: https://github.com/actions/setup-node#supported-version-syntax
        node-version: ">=20" 

    - name: Cache NPM dependencies
        uses: actions/cache@v4
        with:
        path: node_modules
        key: $-npm-cache
        restore-keys: |
            $-npm-cache
    - name: Install Dependencies
        run: npm install
    - name: Build
        run: npm run build
    - name: Upload Pages artifact
        uses: actions/upload-pages-artifact@v3
        with:
        path: ./public
deploy:
    needs: build
    permissions:
    pages: write
    id-token: write
    environment:
    name: github-pages
    url: $
    runs-on: ubuntu-latest
    steps:
    - name: Deploy to GitHub Pages
        id: deployment
        uses: actions/deploy-pages@v4

2. Install hexo-deployer-git.
3. Add/Change the following configurations to _config.yml:

_config.yml

deploy:
type: git
repo: https://github.com/<username>/<project>
# for example, this blog is https://github.com/greenmeeple/greenmeeple.github.io
branch: gh-pages

4. After finishing your bog posts, Run hexo clean && hexo deploy.