Hexo static blog deployment on Vercel

Deploying Hexo static blog for free with Vercel

Install Hexo#

Refer to the official documentation Documentation | Hexo
In theory, you only need to complete the "Overview" and "Building" steps
Install themes: see later section

Create a GitHub remote repository#

Create a new repo on GitHub with any name, leave other settings unchanged, can be set as private
Generate a Personal access token in your account settings and keep it safe.

Create a local git repository and push to GitHub#

Go to the root directory of Hexo

# Create a new git repository
git init
git add .
git commit -m "first commit"
git branch -M main

# Connect to GitHub, example: https://github.com/<username>/<reponame>.git
git remote add origin <your remote repository URL>
# Set credential helper, remove --global parameter to save only for current repository
git config --global credential.helper store 

git push -u origin main
# It will ask for your username and password, note that the password is the Personal access token generated earlier, not your GitHub account password

Deploy with Vercel#

Log in to vercel.com using your GitHub account
Choose to add a new project from GitHub and select the repo you just created
It will automatically recognize it as a Hexo project, no need to change anything, just confirm
Now you can access it using the domain provided by Vercel or use your own domain
If there are any changes in your local project, use git add ., git commit, git push and Vercel will automatically update

Notes#

About themes#

There are pros and cons to both git clone and git submodule add, you can choose after understanding them

git clone -b master https://github.com/jerryc127/hexo-theme-butterfly.git themes/butterfly
# or
git submodule add https://github.com/jerryc127/hexo-theme-butterfly.git themes/butterfly

About file names#

If you copy and paste a markdown file from elsewhere, remember to remove any special characters from the file name, otherwise it may work locally but result in a 404 error on Vercel
If you create a file using hexo new, you will notice that even if there are special characters in the file name, they will be automatically removed (not affected in Front-matter), so you can confidently use special characters.