Hexo本地写作环境配置

发表于 更新于 分类于 阅读次数： Waline： 本文字数： 2.4k 阅读时长 ≈ 2 分钟

写作缘由

由于经常换电脑设备，每次更换设备时都需要重新配置Hexo环境，故对配置流程进行记录，以供后续使用。

本地环境搭建

  1. 安装node.js （这里最好安装版本 v12 否则可能出现部署不成功的情况）

    window 安装：Download | Node.js (nodejs.org)

    Linux 安装：

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

    安装完成后输入以下命令检查是否安装成功：

    1
    2
    $ node -v
    $ npm -v

  2. 安装Hexo

    首先修改 npm 到国内源：

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

    输入以下命令进行确认：

    1
    $npm get registry

    在 Blog 所在文件夹根目录打开命令行，输入以下命令强制安装Hexo：

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

    安装完成后输入以下命令检查是否安装成功：

    1
    $hexo -v

    如果使用的是已有环境，则可以通过以下命令来自动安装环境所需包：

    1
    $npm install --force

  3. 安装pandoc typora写作导出和hexo使用pandoc渲染时均需要使用pandoc（使用默认渲染引擎可以跳过这一步

    pandoc下载地址为：https://pandoc.org/installing.html

插件

steam 展示

项目链接：https://github.com/HCLonely/hexo-steam-games

  1. 安装插件

    1
    npm install hexo-steam-games --save

  2. 配置hexo的_config.yml文件

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    steam:
      enable: true
      steamId: '*****' #steam 64位Id
      path:
      title: Steam游戏库
      quote: '人人都是头号玩家'
      tab: all
      length: 1000
      imgUrl: '*****'
      proxy:
        host:
        port:
      extra_options:
        key: value
    • enable: 是否启用
    • steamId: steam 64位Id(需要放在引号里面，不然会有BUG), 需要将steam库设置为公开！
    • path: 页面路径，默认steamgames/index.html
    • title: 该页面的标题
    • quote: 写在页面开头的一段话,支持html语法
    • tab: all或recent, all: 所有游戏, recent: 最近游玩的游戏
    • length: 要显示游戏的数量，游戏太多的话可以限制一下
    • imgUrl: 图片链接，在quote下面放一张图片，图片链接到Steam个人资料，可留空
    • proxy: 如果无法访问steam社区的话请使用代理
      • host: 代理ip或域名
      • port: 代理端口
    • extra_options: 此配置会扩展到Hexo的page变量中

  3. 使用

    1. 在hexo generate或hexo deploy之前使用hexo steam -u命令更新steam游戏库数据！
    2. 删除游戏库数据指令:hexo steam -d

添加 Bilibili 追番/追剧列表

参考自：https://opensourcelibs.com/lib/hexo-bilibili-bangumi

  1. 安装

    1
    npm install hexo-bilibili-bangumi --save

  2. 配置hexo的_config.yml文件

    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:
      enable: true
      path:
      vmid:
      title: '追番列表'
      quote: '生命不息，追番不止！'
      show: 1
      lazyload: true
      loading:
      metaColor:
      color:
      webp:
      progress:
      extra_options:
        key: value

    # 追剧设置
    cinema:
      enable: true
      path:
      vmid:
      title: '追剧列表'
      quote: '生命不息，追剧不止！'
      show: 1
      lazyload: true
      loading:
      metaColor:
      color:
      webp:
      progress:
      extra_options:
        key: value
    • enable: 是否启用
    • path: 页面路径，默认bangumis/index.html, cinemas/index.html
    • vmid: 哔哩哔哩的 vmid(uid),如何获取？
    • title: 该页面的标题
    • quote: 写在页面开头的一段话，支持 html 语法，可留空。
    • show: 初始显示页面：0: 想看, 1: 在看, 2: 看过，默认为1
    • lazyload: 是否启用图片懒加载，如果与主题的懒加载冲突请关闭，默认true
    • loading: 图片加载完成前的 loading 图片，需启用图片懒加载
    • metaColor: meta 部分(简介上方)字体颜色
    • color: 简介字体颜色
    • webp: 番剧封面使用webp格式(此格式在safari浏览器下不显示，但是图片大小可以缩小 100 倍左右), 默认true
    • progress: 获取番剧数据时是否显示进度条，默认true
    • extra_options: 此配置会扩展到Hexopage变量中

  3. 使用

    1. 在hexo generate或hexo deploy之前使用hexo bangumi -u命令更新追番数据，使用hexo cinema -u命令更新追剧数据！
    2. 删除数据命令:hexo bangumi -d/hexo cinema -d

小结

以上步骤结束后一般即可以进行写作和部署，若依然存在问题可以访问Troubleshooting | Hexo进行错误排查。