前言

本教程基于Butterfly4.8.5制作，如后期版本更新导致教程失效，请在评论区与我联系

生成文件

安装 Hexo 完成后，请执行下列命令，Hexo 将会在指定文件夹中新建所需要的文件。

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

新建完成后，指定文件夹的目录如下：

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

_config.yml

网站的配置信息，您可以在此配置大部分的参数。

package.json

应用程序的信息。EJS, Stylus 和 Markdown 渲染引擎 已默认安装，您可以自由移除。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
{
  "name": "hexo-site",
  "version": "0.0.0",
  "private": true,
  "hexo": {
    "version": ""
  },
  "dependencies": {
    "hexo": "^3.8.0",
    "hexo-generator-archive": "^0.1.5",
    "hexo-generator-category": "^0.1.3",
    "hexo-generator-index": "^0.2.1",
    "hexo-generator-tag": "^0.2.0",
    "hexo-renderer-ejs": "^0.3.1",
    "hexo-renderer-stylus": "^0.3.3",
    "hexo-renderer-marked": "^0.3.2",
    "hexo-server": "^0.3.3"
  }
}

scaffolds

模板文件夹。当您新建文章时，Hexo 会根据 scaffold 来创建文件。

Hexo 的模板是指在新建的文章文件中默认填充的内容。例如，如果您修改 scaffold/post.md 中的 Front-matter 内容，那么每次新建一篇文章时都会包含这个修改。

source

资源文件夹是存放用户资源的地方。除 _posts 文件夹之外，开头命名为 _ (下划线)的文件 / 文件夹和隐藏的文件将会被忽略。Markdown 和 HTML 文件会被解析并放到 public 文件夹，而其他文件会被拷贝过去。

themes

主题 文件夹。Hexo 会根据主题来生成静态页面。（本教程已弃用）

下载主题

此方法只支持 Hexo 5.0.0 以上版本

通过 npm 安装并不会在 themes 里生成主题文件夹，而是在 node_modules 里生成

在你的 Hexo 根目录里

1
npm install hexo-theme-butterfly

升级方法：在 Hexo 根目录下，运行 npm update hexo-theme-butterfly

稳定版【建议】
在你的 Hexo 根目录里

1
git clone -b master https://gitee.com/immyw/hexo-theme-butterfly.git themes/butterfly

测试版

测试版可能存在Bugs，追求稳定的请安装稳定版

如果想要安装比较新的dev分支，可以 
1
git clone -b dev https://gitee.com/immyw/hexo-theme-butterfly.git themes/butterfly

升级方法：在主题目录下，运行 git pull

稳定版【建议】
在你的 Hexo 根目录里

1
git clone -b master https://github.com/jerryc127/hexo-theme-butterfly.git themes/butterfly

测试版

测试版可能存在Bugs，追求稳定的请安装稳定版

如果想要安装比较新的dev分支，可以 
1
git clone -b dev https://github.com/jerryc127/hexo-theme-butterfly.git themes/butterfly

升级方法：在主题目录下，运行 git pull

应用主题

修改 Hexo 根目录下的 _config.yml，把主题改为 butterfly。

1
theme: butterfly

安装插件

如果你没有 pug 以及 stylus 的渲染器，请下载安装：

1
npm install hexo-renderer-pug hexo-renderer-stylus --save

升级建议

为了减少升级主题后带来的不便，请使用以下方法（建议，可以不做）。

前往博客目录-node_modules-hexo-theme-butterfly
在 hexo 的根目录创建一个文件 _config.butterfly.yml，并把上述目录的_config.yml 内容复制到 _config.butterfly.yml 去。( 注意: 复制的是主题的 config.yml，而不是 hexo 的 onfig.yml)

注意： 不要把主题目录的 config.yml删掉。

注意： 以后只需要在 config.butterfly.yml进行配置就行。

如果使用了_config.butterfly.yml 配置主题的 config.yml将不会有效果。

Hexo会自动合併主题中的 config.yml和 config.butterfly.yml里的配置，如果存在同名配置，会使用 config.butterfly.yml的配置，其优先度较高。

image-20200805191531090