Back to Blog

My Hexo Writing Setup

Records en-US
Table of Contents
Table of Contents

For the lovely Anbao (安宝), @wiliyaya. My Hexo notes are in my notebook.

Preparation

I write notes in Obsidian, then deploy directly with Git, linking it to GitHub Actions to automate Hexo's three-command routine. This is just my own setup, for reference.

Obsidian

I use Hexo's source folder directly as an Obsidian vault and write my notes in it.
But—but if you don't want to tinker (or learn strange things about Git), I suggest using the entire Hexo blog folder as an Obsidian vault. That makes automated deployment with Git very, very convenient!

The Obsidian plugins I use to help with writing are:

Templater

Hexo posts need frontmatter to be read correctly. Running hexo new post from the command line is a bit of a hassle. I use Obsidian's Templater plugin instead, configured as shown:
I only set Template folder location to specify the template folder

Here's my template. Create a Templates folder inside source, add an md file with whatever name you like, and paste in the following:

---
title: <% tp.file.title %>
date: <% tp.date.now("YYYY-MM-DD HH:mm:ss") %>
tags: 
categories: 
description: 
cover:
---
# <% tp.file.title %>

After writing an md post, click the Templater plugin in the sidebar and choose your template. The post will automatically take a form Hexo recognizes.

Image auto upload

Skip this if you don't have an image-hosting service.
If you're interested in deploying one, I use lskyPro with Cloudflare R2 storage, paired with PicGo. I've actually replaced PicGo with PicList because it supports deleting files from the cloud.
See the official PicGo documentation and the documentation for the handier PicList. Together with this plugin, it's ready to use.

For local images, I've always found Hexo's requirement to put images in the image folder a nuisance, along with dealing with the paths Obsidian copies. I think it's better to set up image hosting early. Quick and convenient. 😉

Git

On desktop, if there's a git folder inside your folder, the plugin recognizes it automatically. Using git commit and git push there is much like VS Code's built-in Git support.
But my Obsidian vault is only the source folder, so I first had to run git init, then connect it to the source-code repository as a submodule... A lot of trouble. Here, I'd simply recommend putting the entire blog folder into Obsidian.

GitHub Actions

I followed akilar's tutorial. What follows is just my own workflow configuration.
❗Follow the tutorial's setup steps first. I'm only sharing the GitHub Actions configuration I use!

Please don't just copy and paste it. Change the settings to your own first.

# GitHub Actions: 自动部署 Hexo 博客

name: 自动部署

on:
  push:
    branches:
      - main  # 监听 main 分支，触发部署，如果你的分支不是 main，比如 master 那后面的 main 都要改掉。

  release:
    types:
      - published

jobs:
  deploy:
    runs-on: ubuntu-latest
    steps:
    - name: 检查分支
      uses: actions/checkout@v3  # 更稳定
      with:
        ref: main
        submodules: true  # 让 GitHub Action 自动拉取 submodule，没配置的可以不写
        token: ${{secrets.GITHUBTOKEN }}

    - name: 安装 Node
      uses: actions/setup-node@v3
      with:
        node-version: "18"  
        cache: npm  # 让 GitHub 自动缓存 npm 依赖，加快执行速度

    - name: 设置时区
      run: |
        export TZ='Asia/Shanghai'

    - name: 缓存 Hexo 依赖
      uses: actions/cache@v3
      with:
        path: node_modules
        key: hexo-${{ runner.os }}-${{ hashFiles('package-lock.json') }}
        restore-keys: |
          hexo-${{ runner.os }}-

    - name: 安装 Hexo
      run: |
        npm install hexo-cli -g

    - name: 安装依赖
      run: npm install  # 直接 `npm install`


    - name: 生成静态文件
      run: |
        hexo clean
        hexo generate

    - name: 部署到 GitHub Pages
      run: |
        cd ./public
        git init
        git config --global user.name '你的github名' 
        git config --global user.email '你配置的git的邮箱'
        git add .
        git commit -m "更新博客 $(date +"%Z %Y-%m-%d %A %H:%M:%S") Updated By Github Actions"
        git branch -M main
        git push --force --quiet "https://你的GitHub名:${{ secrets.GITHUBTOKEN }}@github.com/你的GitHub名/你的GitHub的github.io仓库名.git" main

Your GitHub username isn't the display name you've chosen. It's the name in the red box on your profile page.
You can also follow the original tutorial and put the names in environment variables, then use ${{ secrets.GITHUBUSERNAME }} and ${{ secrets.GITHUBEMAIL }} in the single-quoted areas.

Once it's configured, a Git commit can trigger Hexo's three steps automatically. No more copying, pasting, and typing commands by hand.

That's It

Those are the basic steps. If you have a better way to improve it, give me a shout. I want to enjoy writing and publishing my notes too 😉.
For writing and publishing little posts on a phone, a dynamic blog like Typecho is still more convenient, like posting to Qzone. But Hexo is stable and doesn't need server maintenance, so it's less to worry about when you want to write something. Have fun!

0 / 2000
Loading comments...