How to Hexo

Posted on | Edited on | In

Title Image # 前言 该博客使用Hexo创建在我的GitHub上，这篇HOWTO的目的是作为一个参考帖，可以在需要参考相关内容的时候得到解答。因此，这篇文章的内容也会不断更新。

安装Git

  • Windows：下载并安装git。
  • Mac：使用 Homebrew, MacPorts ：brew install git；或下载 安装程序 安装。
  • Linux (Ubuntu, Debian)：sudo apt-get install git-core
  • Linux (Fedora, Red Hat, CentOS)：sudo yum install git-core

GitHub创建个人仓库

注册一个GitHub账号，创建一个和用户名相同的仓库，后面加.github.io，这样将来部署到GitHub pages时才会被识别，如我的站名solafishes.github.io。

打开Terminal，在Git中加入你的用户名和邮箱，

1
2
git config --global user.name "yourname"
git config --global user.email "youremail"

这里的yourname是GitHub用户名，youremail是GitHub的邮箱。可以使用如下命令检查是否加入： 

1
2
git config user.name
git config user.email

接下来创建SSH Key： 

1
ssh-keygen -t rsa -C "youremail"

不需要设置密码，直接按回车，直到生成完成。生成的key可以在~/.ssh/id)rsa.pub找到，使用pbcopy < ~/.ssh/id_rsa.pub将key全部复制到剪切板。

在GitHub右上角进入Settings,新建new SSH Key。Title为标题，任意填即可，将刚刚复制的id_rsa.pub内容粘贴进去，最后点击Add SSH key。

在Git Bash中检测GitHub公钥设置是否成功，输入 ssh git@github.com。这里之所以设置GitHub密钥原因是，通过非对称加密的公钥与私钥来完成加密，公钥放置在GitHub上，私钥放置在自己的电脑里。GitHub要求每次推送代码都是合法用户，所以每次推送都需要输入账号密码验证推送用户是否是合法用户，为了省去每次输入密码的步骤，采用了ssh，当你推送的时候，git就会匹配你的私钥跟GitHub上面的公钥是否是配对的，若是匹配就认为你是合法用户，则允许推送。这样可以保证每次的推送都是正确合法的。

安装Node.js

Hexo基于Node.js，安装 Node.js 的最佳方式是使用nvm。

cURL: $ curl https://raw.github.com/creationix/nvm/v0.33.11/install.sh | sh Wget: $ wget -qO- https://raw.github.com/creationix/nvm/v0.33.11/install.sh | sh

安装完成后，重启终端并执行下列命令即可安装 Node.js。 $ nvm install stable

或者您也可以下载安装程序来安装。安装后，检测Node.js是否安装成功，在命令行中输入node -v。检测npm是否安装成功，在命令行中输入npm -v。到这了，安装Hexo的环境已经全部搭建完成。

安装Hexo

Hexo是一款基于Node.js的静态博客框架，依赖少易于安装使用，可以方便的生成静态网页托管在GitHub和Coding上，是搭建博客的首选框架。大家可以进入hexo官网进行详细查看，因为Hexo的创建者是台湾人，对中文的支持很友好，可以选择中文进行查看。

使用npm命令安装Hexo，输入：npm install -g hexo-cli。然后在本地创建一个博客文件夹，然后打开Terminal，cd到该文件夹。初始化Hexo:hexo init ./，然后使用npm install。

新建完成后，文件夹目录下有如下内容(详细内容参考)： 

1
2
3
4
5
6
7
8
9
+-- _config.yml //博客的配置文件
+-- package.json //应用程序的信息
+-- scaffolds //生成文章所用的一些模版
+-- node_modules //依赖包
+-- public //存放生成的页面 
+-- source //用来存放文章
|   +-- _posts
|   +-- _drafts
+-- themes //博客的主题

Hexo的一些基本命令包括： * hexo n "new post"或hexo new "new post" 新建名为"new post"的文章。 * hexo g或hexo generate生成博客。 * hexo s或hexo server启动服务本地预览，默认在浏览器中打开localhost:4000即可进行预览。使用-p选项设置端口，-i自定义IP。 * hexo d或hexo deploy部署博客。

推送网站

为了把网站推送到GitHub，需要修改blog目录下的_config.yml文件。打开该文件在最后部分添加如下内容： 

1
2
3
4
deploy:
  type: git
  repo: https://github.com/solafishes/solafishes.github.com.git
  branch: master

使用hexo d就会将你的页面上传到GitHub上的对应仓库里。执行hexo d报错的话使用npm install hexo-deployer-git --save（Git部署插件）应该就能解决。 # 插入图片 Hexo本来不支持markdown语法插入图片，需要下载hexo-asset-image: npm install hexo-asset-image --save。 配置_config.yml里面的post_asset_folder:false这个选项设置为true，执行命令$ hexo new post_name，在source/_posts中会生成文章post_name.md和同名文件夹post_name。将图片资源放在post_name中，文章就可以使用相对路径引用图片资源了。

另外还可以通过标签语法插入图片，但是在安装hexo-asset-image之后，貌似会出现问题。 

1
/2019/04/06/About-Hexo/default.jpg" alt="默认主题"><br><img src="/2019/04/06/About-Hexo/2019/04/06/About-Hexo/default.jpg" title="This is an image"></p>

关于tags和categories

由于使用了Next主题，默认tags和categories页面在目录中是关闭的。按如下步骤设置。 ## 设置主题下的_config.yaml 打开themes/next/_config.yaml，在目录menu设置部分，将注释掉的tags和categories恢复： 

1
2
3
4
5
6
7
8
9
menu:
  home: / || home
  #about: /about/ || user
  tags: /tags/ || tags
  categories: /categories/ || th
  archives: /archives/ || archive
  #schedule: /schedule/ || calendar
  #sitemap: /sitemap.xml || sitemap
  #commonweal: /404/ || heartbeat

创建页面

分别执行hexo new page tags和hexo new page categories，这将在source/目录下生成tags/和categories/。打开这两个文件夹下的index.md并添加type: tags和type: categories这行，并注意冒号后面的空格。

文档处理

在文档头部设置分类信息： 

1
2
3
4
5
6
7
8
9
---
title: Lego+BrickPi机器人课程学习
date: 2019-12-29 19:31:39
tags: 
- BrickPi
- Raspberry Pi
categories:
- 机器人相关教程
---

重新生成博客并部署就可以在目录上看到tags和categories页面。

分类标签

分类层级

如果文章的categories包含层级信息，则如下设置(增加方括号list)：

1
2
3
4
5
categories:
- [Sports, Baseball]
- [MLB, American League, Boston Red Sox]
- [MLB, American League, New York Yankees]
- Rivalries

文章折叠

默认情况下，HEXO会将每个帖子的全文显示出来，这会使得页面冗长。有三种方法可以进行文章折叠。

  1. 在文章中使用 <!-- more --> 手动进行截断，这是Hexo提供的方式，也是Next主题推荐的方式。
  2. 在文章的 front-matter 中添加 description，并提供文章摘录。
  3. 在NEXT主题配置文件中添加auto excerpt信息，不推荐使用：

auto_excerpt: enable: true length: 150

数学公式

参考官方的说明，注意一定要确保电脑上首先已经安装了Pandoc，没有安装的话在Mac上运行：brew install Pandoc。注意如果要引用公式，则必须使用{equation}环境，通过$\eqref{eq1}$命令inline引用公式，例如对下面公式\(\eqref{eq1}\)的引用。

\[\begin{equation} \begin{aligned} a &= b + c \\ &= d + e + f + g \\ &= h + i \end{aligned} \end{equation}\label{eq2}\]

\[\begin{equation} e=mc^2 \end{equation}\label{eq1}\]

尾言

本文介绍了使用Hexo建博客的基本内容，涉及到主题的修改和其他个性化设置，需要的时候会在后续文章介绍。