Hello Hexo World

Posted on Edited on In , Views:

The blog is migrated to Hexo today! Check documentation for more info.

Quick Start

What is Hexo?

Hexo is a fast, simple and powerful blog framework. You write posts in Markdown (or other markup languages) and Hexo generates static files with a beautiful theme in seconds.

Installation Requirements

Installing Hexo is quite easy and only requires the following beforehand:

  • Node.js (Should be at least Node.js 10.13, recommends 12.0 or higher)
  • Git

Install Hexo

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
$ sudo npm install -g hexo-cli

$ hexo -v
hexo-cli: 4.3.1
os: darwin 20.4.0 11.3
node: 18.16.1
acorn: 8.8.2
ada: 1.0.4
ares: 1.19.1
brotli: 1.0.9
cldr: 42.0
icu: 72.1
llhttp: 6.0.11
modules: 108
napi: 8
nghttp2: 1.52.0
nghttp3: 0.7.0
ngtcp2: 0.8.1
openssl: 3.0.9+quic
simdutf: 3.2.2
tz: 2022g
undici: 5.21.0
unicode: 15.0
uv: 1.44.2
uvwasi: 0.0.15
v8: 10.2.154.26-node.26
zlib: 1.2.13

Initialize Hexo

Once Hexo is installed, run the following commands to initialize Hexo in the target .

1
2
3
$ hexo init <site-folder>
$ cd <site-folder>
$ npm install

Once initialized, here’s what your project folder will look like:

1
2
3
4
5
6
7
8
.
├── _config.yml
├── package.json
├── scaffolds
├── source
|   ├── _drafts
|   └── _posts
└── themes

You can configure most settings in _config.yml.

Install Next theme

If you’re using Hexo 5.0 or later, the simplest way to install is through npm:

1
2
$ cd hexo-site
$ npm install hexo-theme-next

Or you can clone the entire repository:

1
2
$ cd hexo-site
$ git clone https://github.com/next-theme/hexo-theme-next themes/next

Install hexo-generator-searchdb

This is Search data generator plugin for Hexo.

This plugin is used for generating a search index file, which contains all the necessary data of your articles that you can use to write a local search engine for your blog. Supports both XML and JSON format output.

1
% sudo npm install hexo-generator-searchdb

NexT supports the related posts functionality according to hexo-related-posts

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
%  npm install hexo-related-posts --save-dev

% hexo clean
INFO  Validating config
INFO  Deleted database.

% hexo server
INFO  Validating config
INFO  ==================================
  ███╗   ██╗███████╗██╗  ██╗████████╗
  ████╗  ██║██╔════╝╚██╗██╔╝╚══██╔══╝
  ██╔██╗ ██║█████╗   ╚███╔╝    ██║
  ██║╚██╗██║██╔══╝   ██╔██╗    ██║
  ██║ ╚████║███████╗██╔╝ ██╗   ██║
  ╚═╝  ╚═══╝╚══════╝╚═╝  ╚═╝   ╚═╝
========================================
NexT version 8.18.1
Documentation: https://theme-next.js.org
========================================
INFO  Start processing
INFO  Calculating of related posts is enabled. Start processing...
INFO  TF/IDF is calculated
INFO  Related post processing done
INFO  Hexo is running at http://localhost:4000/ . Press Ctrl+C to stop.

Start Hexo server locally

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
% cd <site-folder>
% hexo server
INFO  Validating config
INFO  ==================================
  ███╗   ██╗███████╗██╗  ██╗████████╗
  ████╗  ██║██╔════╝╚██╗██╔╝╚══██╔══╝
  ██╔██╗ ██║█████╗   ╚███╔╝    ██║
  ██║╚██╗██║██╔══╝   ██╔██╗    ██║
  ██║ ╚████║███████╗██╔╝ ██╗   ██║
  ╚═╝  ╚═══╝╚══════╝╚═╝  ╚═╝   ╚═╝
========================================
NexT version 8.18.1
Documentation: https://theme-next.js.org
========================================
INFO  Start processing
INFO  Hexo is running at http://localhost:4000/ . Press Ctrl+C to stop.

More info: Server

Create a new post

1
$ hexo new "My New Post"

More info: Writing

Generate static files

1
$ hexo generate

More info: Generating

Deploy to remote sites

1
$ hexo deploy

More info: Deployment

github-pages

Config git login credential

1
2
3
4
5
git config --global user.name "username"
git config --global user.email "xxx"
git config credential.username "username"
git config --global core.autocrlf false
git config --global --list

Use one-command deployment if you prefer not to upload your source folder to GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
# Install hexo-deployer-git
npm install hexo-deployer-git --save

# Add the following configurations to hexo _config.yml, (remove existing lines if any).
deploy:
  type: git
  repo: https://github.com/<username>/<username.github.io>
  # example, https://github.com/hexojs/hexojs.github.io
  branch: gh-pages

# Run hexo clean && hexo deploy
hexo clean 
hexo deploy

Follow the instructions here to change the branch to “gh-pages” in order to build the github pages website.

Check the webpage at username.github.io.

Watch for File Changes

Hexo can watch for file changes and regenerate files immediately. Hexo will compare the SHA1 checksum of your files and only write if file changes are detected.

1
$ hexo generate --watch

Deploy After Generating

CNAME file should be added to source folder. Otherwise, the custom domain for github pages will be reset after deploy.

1
2
3
4
5
6
7
8
9
$ ls source
Mode                 LastWriteTime         Length Name
----                 -------------         ------ ----
d-----         9/21/2023   6:34 PM                _posts
d-----         9/19/2023   9:07 PM                about
d-----         9/19/2023   9:07 PM                categories
d-----         9/18/2023  12:42 PM                images
d-----         9/19/2023   9:07 PM                tags
-a----         9/21/2023   8:28 PM             38 CNAME

The content of CNAME file is as below. It includes the domain name of the website.

1
2
www.flamingbytes.com
flamingbytes.com

To deploy after generating, you can run one of the following commands. There is no difference between the two.

1
2
$ hexo generate --deploy
$ hexo deploy --generate

Reference