Hexo notes I

Posted on   |   In   |  
  1. 1. Hexo commands
  2. 2. Hexo themes
  3. 3. Create post TOC
  4. 4. Error: Module version mismatch

  • Hexo commands

Install Hexo, make sure you have node.js installed

npm install hexo-cli -g

Create hexo folder (your site folder)

hexo init <folder-name>
cd blog
npm install

Once initialised, the site folder structure looks like:

.
├── _config.yml
├── package.json
├── scaffolds
├── source
|   ├── _drafts
|   └── _posts
└── themes

New post: If no layout is provided, Hexo will use the default_layout from _config.yml. If the title contains spaces, surround it with quotation marks. The new post file appears in /source/_posts.

$ hexo new [layout] <title>

Start server: by default http://localhost:4000/

hexo server

Clean cache file db.json 

hexo clean

Watch file changes in debug mode

hexo s --debug

Generate static file

hexo generate

Before deployment, in _config.yml file

deploy:
  type: git
  repo: https://github.com/xxx...
  branch: [master]
  message: "Site updated: {{ now('YYYY-MM-DD HH:mm:ss') }}"

Deploy the website

hexo deploy

If ERROR shows like Deployer not found: github, it needs to change the deploy type to git.

npm install hexo-deployer-git --save

Commands shortcut

hexo g == hexo generate
hexo d == hexo deploy
hexo s == hexo server
hexo n == hexo new
# e.g. commands combination
hexo d -g

Create draft and publish it

hexo new draft <title>
hexo publish draft <title>

Drafts are not displayed by default. You can add the --draft option when running Hexo or enable the render_drafts setting in _config.yml to render drafts.

Ref: Hexo getting started

  • Hexo themes

1. NexT
Install NexT theme

git clone https://github.com/iissnan/hexo-theme-next themes/next

Folow the setup instructions in /theme/next/_config.yml

2. Bootstrap
Another theme, Bootstrap, with good layout and available functions.

3. Pacman
A bueatiful theme, Pacman.

  • Create post TOC

It might be a different based on the theme, but the logic behind is similar. Taking the NexT theme for instance, in /theme/next/layout/_macro, find the file post.swig, which configures the post content display.

{% if post.toc %}
    <div id="toc" class="post-toc">
        {% set toc = toc(page.content, {"class": "nav", list_number: post.toc_num}) %}
        <strong class="">Table of Contents</strong>
        <div class="post-toc-content">{{ toc }}</div>
    </div>
{% endif %}

There are two controls there, so in the post front-matter, one can add toc: true for display TOC and toc_num: true for showing list numbers.

For defaut display TOC, just change the if statement, e.g.,

{% if (post.toc == false) %}
# and show list number by default
{% set toc = toc(page.content, {"class": "nav", list_number: post.toc_num==false}) %}

Then, you don’t have to set front-matter for each post.

  • Error: Module version mismatch

    It seems there is a mismatch between one of:
  1. The hexo in node_modules/.bin
  2. The hexo in /usr/local/bin/hexo
  3. The globally installed hexo which may well have been the one from 2.

One solution is:

npm uninstall -g hexo-cli
rm /usr/local/bin/hexo
rm -rf node_modules
npm install
npm install -g hexo-cli