Hexo Blog Develop Notes

Prerequisites: nvm for npm & node

Hexo also need git, but just one command:

1
sudo apt install git

Why nvm?

Until now, my ubuntu machine are using node version 18.20.2 and npm version 10.5.2.

Hexo sometimes need a higher version number of both npm and node, then you may need nvm.

nvm is a version manager for Node.js, it allows you to quickly install and use different versions of node via the command line.

Git Repo for nvm is here.

Install nvm

Recommanded install nvm using bash:

1
curl -o- https://raw.githubusercontent.com/nvm-sh/nvm/v0.39.2/install.sh | bash

Then add nvm to the Path:

1
2
3
4
# ~/.bashrc or some kind of ~/.zshrc
export NVM_DIR="$HOME/.nvm"
[ -s "$NVM_DIR/bin/nvm.sh" ] && . "$NVM_DIR/bin/nvm.sh" # This loads nvm
alias nvm='. ~/.nvm/nvm.sh'

Check nvm version by:

1
nvm --version

Usage

check node version

To check the node version:

1
nvm ls

install specific version of node

To install a specific version of node:

1
nvm install ${NODE_VERSION_NUMBER}

If you just wan to install the latest release of node, just nvm install node

When you install a new node version, it would change your node version into it.

If you want to change node into a specific version of node:

1
nvm use ${NODE_VERSION_NUMBER}

Remove a specific version of node:

1
nvm uninstall ${NODE_VERSION_NUMBER}

install npm for each node

nvm also alow you install different version of npm for each node:

1
nvm install-npm ${NPM_VERSION_NUMBER} ${NODE_VERSION_NUMBER}

First Step: Install & Init & Config & Generate hexo

Source doc: hexo doc

Install

Recommand using global instal hexo-cli for beginner:

1
npm install -g hexo-cli

After that, you can check you hexo version:

1
hexo -v

and get such output:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
INFO  Validating config
hexo: 7.1.1
hexo-cli: 4.3.1
os: linux 5.4.0-144-generic Ubuntu 20.04.6 LTS (Focal Fossa)
node: 18.20.2
acorn: 8.10.0
ada: 2.7.6
ares: 1.27.0
base64: 0.5.2
brotli: 1.0.9
cjs_module_lexer: 1.2.2
cldr: 44.1
icu: 74.2
llhttp: 6.1.1
modules: 108
napi: 9
nghttp2: 1.57.0
nghttp3: 0.7.0
ngtcp2: 0.8.1
openssl: 3.0.13+quic
simdutf: 4.0.8
tz: 2024a
undici: 5.28.4
unicode: 15.1
uv: 1.44.2
uvwasi: 0.0.19
v8: 10.2.154.26-node.36
zlib: 1.3.0.1-motley

Init

One command: hexo init, but remember run npm install

1
2
3
hexo init ${FOLDER_NAME}
cd ${FOLDER_NAME}
npm install

Config

A just-init hexo blog folder would seem like:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
.
├── .github
| ├── dependabot.yml
├── node_modules
| ├── ...
| └── ...
├── scaffolds
| ├── draft.md
| ├── page.md
| └── post.md
├── source
| └── _posts
| └── hello-world.md
├── themes
| └── .gitkeep
├── _config_landscape.yml
├── _config.yml
├── .gitignore
├── package-lock.json
└── package.json

In _config.yml:

Generate

1
hexo gen
1
hexo clean

Second Step: deploy it on GitHub page

For update and deploy the hexo blog in one step:

1
hexo clean && hexo generate && hexo deploy

or

1
hexo clean && hexo generate && hexo server

But if you deploy firstly, you need to configure the _config.yml:

1
2
3
4
5
6
# Deployment
# Docs: https://hexo.io/docs/one-command-deployment
deploy:
type: git
repo: https://github.com/<username>/<username>.github.io.git
branch: main

Then run:

1
hexo deploy

Last Step: Change your theme

I use this theme: hexo-theme-butterfly

Config theme: butterfly

Afterword: How to writting a blog post?

Source: hexo writting