hexo+gitee+Butterfly构建个人博客

搭建Hexo

搭建Hexo比较简单，按照官方文档的步骤操作即可。在这里我们简单说一下：

安装前提

安装Hexo需要先安装:

1、Node.js(Node.js版本不低于8.10，建议使用Node.js 10.0及以上版本)

2、Git

Node.js和Git的具体安装方法，在Hexo的文档页有详细介绍，这里不再阐述。

安装Hexo

npm install -g hexo-cli

初始化

以Windows环境为例，打开cmd命令窗口，定位到需要存放md的文件夹路径下，如:C:\Users\xiaolu\Desktop\hexo,执行以下命令:

hexo init

命令执行完成后，将在C:\Users\xiaolu\Desktop\hexo下生成相应的文件，目录如下：

主要关注以下目录及文件:

    _config.yml

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

    source--posts

    存放MD文件

    themes

    主题文件夹

生成静态页面

hexo g

会在根目录C:\Users\xiaolu\Desktop\hexo下生成public文件夹，里面包含相应的html页面。

启动服务

hexo s

更换Butterfly主题

默认的主题可能并不是我们想要的效果，那么就可以通过更换主题来实现。可以在官网的主题页面选择想要的主题。这里，选择Butterfly主题来应用。

Butterfly主页的展示页面：https://jerryc.me ,对应的文档页面为:https://jerryc.me/posts/21cfbf15

根据文档说明直接配置主题即可，这里简单记录如下：

主题安装

可通过以下命令安装主题:

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

主题应用

修改站点配置文件_config.yml,把主题修改为Butterfly

theme: Butterfly

为便于后续平滑升级，在source目录下创建_data文件夹,将Themes/Butterfly目录下的_config.yml复制一份到source/_data目录下,并改名为butterfly.yml

执行以下指令,以查看应用主题后的效果:

hexo clean #清除旧的内容

hexo g #生成发布用的静态页面

hexo s #启动服务

得到 http://localhost:4000 网址后在本地浏览器打开进行查看

注意，第一次运行会报一下错误

这时我们回到终端下载插件即可：

npm install hexo-renderer-pug hexo-renderer-stylus

然后再次执行素质三联：

    hexo clean

    hexo g

    hexo s

刷新http://localhost:4000 ,可以看到更新后的主题:

其它细节设置可以参考Butterfly的文档来配置。

部署到gitee

新建仓库

这里假设已经注册过了Gitee帐户，如果没有，可以去Gitee官网注册。

注册好了后，登录Gitee,创建仓库：点击右上角的+号，选择new repository:

设置Hexo配置文件

修改完部署的必要配置后进行新的素质三联：

    hexo clean

    hexo g

    hexo d

第一次 hexo d 会报错以下错误，因为没有安装 hexo-deployer-git 命令

我们只需要在终端中安装一下，问题就迎刃而解

npm install hexo-deployer-git --save

安装完成后再一次执行新的素质三联就可以正常操作了
hexo d 执行完后我们查看仓库，确认部署成功后，进行以下操作：

第一步

第二部

第三步

展示

其他细节问题与美化请参考官方文档进行修改。

每日语录：
/pic.downk.cc/item/5e9f19b8c2a9a83be5cccd47.png" div align=center />

其他细节问题与美化请参考官方文档进行修改。

每日语录：
只有一条路不能选择，那就是放弃的路；只有一条路不能拒绝，那就是成长的路。你要的比别人多，就必须付出得比别人多。