Hexo使用简介

发布时间：2019/04/25

简述

在说hexo之前要先说一下写博客过程，我们要写一篇博客时通常采用Markdown格式的文件，简单来说，Markdown就是通过简单的对文本进行标记来实现一些页面布局效果的一种方案。一篇Markdown格式的文章写完后，再把Markdown格式转化成html格式的文件用来网站部署，到这里就可以说一下hexo了。

hexo是一款基于nodejs平台的博客类网站生成工具，使用hexo可以帮我们方便组织我们的Markdown文件、可以帮我们把Markdown格式的文章生成静态html页面、通过插件还可以帮我们把生成的html页面部署到生产环境。

下面我们就来说一下hexo从安装,到写作,到部署至GitHub Pages的过程,由于本文主要是对hexo的简单描述，所以本文章默认你已经安装了nodejs，并且对github有所了解（新建仓库），这里对这些概念不再展开描述了。

hexo安装

使用hexo之前要先全局安装hexo的命令行工具：

1
$ npm install -g hexo-cli

安装完成hexo之后系统就会有一个hexo的命令行工具可以使用，可以使用下面三行命令来创建hexo’工程’;

1
2
3
4
5
$ hexo init <folder>   # 创建hexo工程,把<folder>替换成你想要的名字

$ cd <folder>          # 进入工程目录

$ npm install	       # 安装项目依赖

为了后面的叙述方便，我们需要的一些hexo的插件在这里也一气呵成都安装上：

1
2
3
4
$ npm install hexo-all-minifier  # 一个可以把生成的网页文件进行压缩，有利于提升网站的访问速度

$ npm install hexo-deployer-git  # 一个可以帮助我们部署网站的插件

hexo 项目目录结构

到目前为止，我们的hexo工程已经创建完毕，下面对hexo项目的重要的几个目录以及文件做一下介绍：

1
2
3
4
5
6
7
_config.yml     # 项目的配置文件
public          # 生成的网站文件，稍后部署博客网站也就是部署这个目录中的文件
scaffolds       # 文章模版，创建新文章时可以选择的模版
source          # 存放我们写的文章（Markdown）
  _discarded        # 存放丢弃的文章，理解成垃圾娄把
  _drafts           # 存放草稿，还没有完全写完的文章可以先放在这个目录下
  _posts            # 存放我们要发布的文章，放在这个目录下的Markdown文件稍后都会生成对应的网页

常用的hexo命令

1
2
3
4
5
6
7
8
9
$ hexo new [layout] <filename>     # 新建一篇文章,layout指scaffolds目录中的模版文件，默认已经有draft、page、post可以选择，如果有需要的话你还可以继续新建模版;新建的文章会放在source/_posts 目录下，有一个例外就是layout设置为draft时文件会放在source/_drafts目录下。

$ hexo publish [layout] <filename> # 发布草稿，会把source/_drafts目录下的文件转移到source/_posts目录下。

$ hexo server                      # 开启一个可以预览生成的blog效果的服务。

$ hexo generate                    # 生成网站，会生成source/_posts目录下文章对应的网页文件，网页文件放在public目录下。

$ hexo deploy                      # 部署网站,部署方法下面会说

部署准备

部署网站可以按照自己的喜好部署，在这里给出一种依赖github pages来进行部署的方案，github pages给提供了网站部署功能，使用方法是在github中创建以 ‘用户名.github.io’为名称的一个仓库，然后在这个仓库上传的文件可以通过’用户名.github.io’域名进行访问。创建步骤如下：

  1. 登录 github,如果没有账号的话就注册一个
  2. 创建一个git仓库，名称必须是‘<你的github名称>.github.io’
  3. 在仓库页面，点击’clone and downlowd’复制仓库地址，留作稍后部署之用（仓库链接是以.git结尾的那个链接，不是页面浏览器地址框中的链接哈）

配置

_config.yml是hexo的配置文件,详细的字段解释在这里也不再赘述，可以看官网的文档，需要说一下的是关于部署的配置和我们对页面压缩插件的配置，打开_config.yml文件。

找到deploy选项：

1
2
3
4
5
6
7
8
9
10
11
把deploy下的type配置为git

repo 配置为刚才复制的github仓库地址

配置好后大致长这样：

deploy:
    type: git
    repo: https://github.com/xxxx/xxxx.github.io.git
    branch: master

在页面最底下添加：

1
all_minifier: true # hexo-all-minifier 插件的配置

部署

截止目前为止，我们已经创建并设置好了hexo项目，使用以下两行命令即可完成部署:

1
2
hexo generate # 生成网站文件
hexo deploy   # 部署网站,第一次会让输入github名称和密码

部署成功后可以在浏览器中输入 ‘你的github名称.github.io’进行查看部署效果。

总结

初接触hexo时，需要先进行hexo的安装，和配置，这些都搞定后以后使用中最常做的操作也就是通过

1
$ hexo new <filename>

创建文章，然后编辑source/_post目录下的文章，最后执行

1
$ hexo generate

生成网站，并部署：

1
$ hexo deploy

最后更新：2022/06/30