Configure Hexo Local Writing Environment.

Posted on Edited on In Views: Waline: Word count in article: 4.2k Reading time ≈ 4 mins.

This is an automatically translated post by LLM. The original post is in Chinese. If you find any translation errors, please leave a comment to help me improve the translation. Thanks!

Reasons for Writing

Due to frequently changing computer devices, every time a device is replaced, the Hexo environment needs to be reconfigured. Therefore, the configuration process is recorded for future use.

Local Environment Setup

  1. Install node.js (it is recommended to install version v12 here, otherwise deployment may fail)

    Windows installation: Download | Node.js (nodejs.org)

    Linux installation:

    1
    2
    $ sudo apt-get install nodejs
    $ sudo apt-get install npm

    After installation, enter the following commands to check if the installation was successful:

    1
    2
    $ node -v
    $ npm -v

  2. Install Hexo

    First, change npm to a domestic source:

    1
    $ npm config set registry http://registry.npm.taobao.org

    Enter the following command to confirm:

    1
    $npm get registry

    Open the command line in the root directory of the Blog and enter the following command to forcefully install Hexo:

    1
    $npm install -g hexo-cli --force

    After installation, enter the following command to check if the installation was successful:

    1
    $hexo -v

    If you are using an existing environment, you can automatically install the required packages for the environment with the following command:

    1
    $npm install --force

  3. Install pandoc typora for writing export and hexo for rendering using pandoc both require the use of pandoc (this step can be skipped if using the default rendering engine)

    Download pandoc from: https://pandoc.org/installing.html

Plugins

Steam Showcase

Project link: https://github.com/HCLonely/hexo-steam-games

  1. Install the plugin

    1
    npm install hexo-steam-games --save

  2. Configure the _config.yml file of hexo

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    steam:
      enable: true
      steamId: '*****' #steam 64-bit Id
      path:
      title: Steam Game Library
      quote: 'Everyone is a top player'
      tab: all
      length: 1000
      imgUrl: '*****'
      proxy:
        host:
        port:
      extra_options:
        key: value
    • enable: Whether to enable
    • steamId: Steam 64-bit Id (needs to be enclosed in quotes, otherwise there may be bugs), Steam library needs to be set to public!
    • path: Page path, default steamgames/index.html
    • title: Title of the page
    • quote: A paragraph at the beginning of the page, supports HTML syntax
    • tab: all or recent, all: all games, recent: recently played games
    • length: Number of games to display, can be limited if there are too many games
    • imgUrl: Image link, place an image below quote linking to the Steam profile, can be left empty
    • proxy: Use a proxy if unable to access the Steam community
      • host: Proxy IP or domain
      • port: Proxy port
    • extra_options: This configuration will be extended to the Hexo page variable

  3. Usage

    1. Use the hexo steam -u command to update the steam game library data before hexo generate or hexo deploy!
    2. Delete game library data command: hexo steam -d

Add Bilibili Bangumi/TV Series List

Reference: https://opensourcelibs.com/lib/hexo-bilibili-bangumi

  1. Install

    1
    npm install hexo-bilibili-bangumi --save

  2. Configure the _config.yml file of 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
    28
    29
    30
    31
    32
    33
    # Bangumi settings
    bangumi:
      enable: true
      path:
      vmid:
      title: 'Bangumi List'
      quote: 'Life goes on, chasing bangumi never stops!'
      show: 1
      lazyload: true
      loading:
      metaColor:
      color:
      webp:
      progress:
      extra_options:
        key: value

    # TV Series settings
    cinema:
      enable: true
      path:
      vmid:
      title: 'TV Series List'
      quote: 'Life goes on, chasing TV series never stops!'
      show: 1
      lazyload: true
      loading:
      metaColor:
      color:
      webp:
      progress:
      extra_options:
        key: value
    • enable: Whether to enable
    • path: Page path, default bangumis/index.html, cinemas/index.html
    • vmid: Bilibili's vmid(uid), How to get it?
    • title: Title of the page
    • quote: A paragraph at the beginning of the page, supports HTML syntax, can be left empty.
    • show: Initial display page: 0: Want to watch, 1: Watching, 2: Watched, default is 1
    • lazyload: Whether to enable image lazy loading, disable if conflicting with the theme's lazy loading, default true
    • loading: Loading image before the image is loaded, lazy loading of images must be enabled
    • metaColor: Font color of the meta section (above the summary)
    • color: Font color of the summary
    • webp: Use webp format for anime covers (this format does not display in Safari browser, but reduces the image size by about 100 times), default true
    • progress: Whether to show a progress bar when getting anime data, default true
    • extra_options: This configuration will be extended to the Hexo page variable

  3. Usage

    1. Use the hexo bangumi -u command to update the bangumi data before hexo generate or hexo deploy, and use the hexo cinema -u command to update the TV series data!
    2. Delete data command: hexo bangumi -d / hexo cinema -d

Summary

After the above steps are completed, you can generally start writing and deploying. If there are still issues, you can visit Troubleshooting | Hexo for error troubleshooting.