本文主要介绍使用Github Pages和Hexo创建个人博客。

前言

使用Github Pages的好处：

静态文件，访问速度快，利于搜索引擎抓取。
免费（仅限于公共仓库，私有仓库需要按月收费）方便，不需要服务器不需要后台。
可以绑定域名。
数据安全，基于github的版本管理。
博客内容可以轻松打包、转移、发布到其它平台。

使用Hexo的好处：

超快速度
Node.js所带来的超快生成速度，让上百个页面在几秒内瞬间完成渲染。
支持 Markdown
Hexo 支持 GitHub Flavored Markdown 的所有功能，甚至可以整合Octopress的大多数插件。
一键部署
只需一条指令即可部署到GitHub Pages,Heroku或其他网站。
丰富的插件
Hexo 拥有强大的插件系统，安装插件可以让 Hexo 支持 Jade, CoffeeScript。

准备工作

在开始之前，必须已经拥有了github账号（注册传送门）。

本文所使用的环境：

Windows 10 下子系统 Ubuntu 18.04
node.js v12.4.0
git v2.17.1
hexo v3.9.0

相关资源链接：

Ubuntu 18.04 子系统：https://www.microsoft.com/store/productId/9N9TNGVNDL3Q
Github: https://github.com
Hexo主题：
- 官方主题站
  https://hexo.io/themes/
- yilia 主题
  https://github.com/litten/hexo-theme-yilia
- jekyll 主题
  https://github.com/pinggod/hexo-theme-jekyll
- indigo 主题
  https://github.com/yscoder/hexo-theme-indigo

搭建github博客

创建仓库

新建一个名为blog.github.io的仓库，其中blog必须为github的用户名。

每个github账户最多只能创建一个使用Github Pages访问的仓库。
注册的邮箱一定要验证，否则不会成功。
仓库名字必须是username.github.io，其中username是用户名。
仓库创建成功不会立即生效，需要过一段时间，大概10-30分钟或更久。
创建成功后，默认会在这个仓库里生成一些示例页面，以后网站所有代码都放在这个仓库里。

绑定域名（可选）

官方说明：https://help.github.com/en/articles/using-a-custom-domain-with-github-pages

域名解析

在域名解析后台（阿里云后台传送门）中配置域名解析。
以阿里云为例，配置如下：

记录类型	主机记录	解析线路（isp)	记录值	MX优先级	TTL
A	@	默认	×××.×××.×××.×××	–	10 分钟
CNAME	www	默认	blog.github.io	–	10 分钟

其中，A记录的记录值为blog.github.io的IP。

CNAME文件

在blog.github.io仓库根目录下，新建名为CNAME的文件，里面填写域名。

域名的格式说明如下：

域名格式	示例(CNAME内容)	地址	自动跳转
@	myblog.com	http://myblog.com	http://www.myblog.com 自动跳转 http://myblog.com
www	www.myblog.com	http://www.myblog.com	http://myblog.com 自动跳转 http://www.myblog.com
二级域名	blog.myblog.com	http://blog.myblog.com	不自动跳转

绑定了新域名之后，blog.github.io并没有失效，而是会自动跳转到绑定的域名。

Github设置

进入blog.github.io，在Settings里填写Custom domain。

使用https访问博客

进入blog.github.io，在Settings里勾选Enforce HTTPS，稍等几分钟后生效。配置后，访问 myblog.com 或 http://myblog.com 会自动跳转到 https://myblog.com。

使用hexo写博客

hexo简介

Hexo是一个简单、快速、强大的基于 Github Pages 的博客发布工具，支持Markdown格式，有众多优秀插件和主题。

Hexo官网： http://hexo.io
github: https://github.com/hexojs/hexo

工作原理

使用Markdown编写文章，Hexo将md文件生成静态页面，然后将静态文件提交到Github中，由Github Pages完成展示。

环境安装

安装Nodejs

1 2	wget https://nodejs.org/download/release/latest/node-v12.4.0-linux-x64.tar.xz tar -C /usr/local --strip-components 1 -xJf node-v12.4.0-linux-x64.tar.xz

安装git

1
2
3

apt-get update -y
apt-get upgrade -y
apt install git

安装Hexo

1	npm install -g hexo

初始化

新建文件夹

1	mkdir ~/blog

初始化

1 2	cd ~/blog hexo init

hexo会自动下载一些文件到这个目录，包括node_modules，目录结构如下图：

1 2	hexo g # 生成 hexo s # 启动服务

执行以上命令之后，hexo就会在public文件夹生成相关html文件，这些文件将来都是要提交到github去的：

hexo s是开启本地预览服务，打开浏览器访问 http://localhost:4000 即可看到内容

第一次初始化的时候hexo已经帮我们写了一篇名为 Hello World 的文章

修改主题

Hexo默认主题是landscape，如果不喜欢可以到官方主题查找其他主题。
本站使用的主题是indigo。

首先，下载主题

1 2	cd ~/blog git clone https://github.com/yscoder/hexo-theme-indigo.git themes/indigo

下载的主题位于~/blog/themes/下

下载需要的其他插件

cd ~/blog
npm install hexo-renderer-less --save
npm install hexo-generator-feed --save
npm install hexo-generator-json-content --save
npm install hexo-helper-qrcode --save
new page tags
new page categories

然后，修改_config.yml中的theme: landscape改为theme: indigo，然后重新执行hexo g来重新生成

注意：hexo有2个_config.yml文件，一个是根目录下的全局的_config.yml，一个是各个theme下的，此处需要修改根目录下的_config.yml文件

如果出现问题，可以先执行hexo clean来清理一下public里的内容，然后再重新生成发布

上传之前

在上传代码到github之前，一定要记得先把以前所有代码下载下来（虽然github有版本管理，但备份一下总是好的），因为从hexo提交代码时会把以前的所有代码都删掉。

上传到github

如果一切都配置好了，发布上传很容易，一句hexo d就搞定，当然关键还是要把所有东西配置好。

首先，ssh key肯定要配置好。

其次，配置_config.yml中有关deploy的部分：

正确写法：

deploy:
  type: git
  repository: git@github.com:liuxianan/liuxianan.github.io.git
  branch: master

错误写法：

deploy:
  type: github
  repository: https://github.com/liuxianan/liuxianan.github.io.git
  branch: master

后面一种写法是hexo2.x的写法，现在已经不行了，无论是哪种写法，此时直接执行hexo d的话一般会报如下错误：

Deployer not found: github 或者 Deployer not found: git

安装deployer插件

1	npm install hexo-deployer-git --save

其它命令不确定，部署这个命令一定要用git bash，否则会提示Permission denied (publickey).
打开git bash，输入hexo d就会将本次有改动的代码全部提交，没有改动的不会：

保留CNAME、README.md等文件

提交之后网页上一看，发现以前其它代码都没了，此时不要慌，一些非md文件可以把他们放到source文件夹下，这里的所有文件都会原样复制（除了md文件）到public目录的：

由于hexo默认会把所有md文件都转换成html，包括README.md，所有需要每次生成之后、上传之前，手动将README.md复制到public目录，并删除README.html。

_config.yml

这里面都是一些全局配置，每个参数的意思都比较简单明了，所以就不作详细介绍了。

需要特别注意的地方是，冒号后面必须有一个空格，否则可能会出问题。

写博客

定位到我们的hexo根目录，执行命令：

1	hexo new 'my-first-blog'

hexo会帮我们在_posts下生成相关md文件：

我们只需要打开这个文件就可以开始写博客了，默认生成如下内容：

当然也可以直接自己新建md文件，用这个命令的好处是帮我们自动生成了时间。

一般完整格式如下：

---
title: postName #文章页面上的显示名称
date: 2019-12-02 15:30:16 #文章生成时间
categories: 默认分类 #分类
tags: [tag1,tag2,tag3] #文章标签
description: 会出现在meta的description里面
---
[以下是正文]

那么hexo new page 'postName'命令和hexo new 'postName'有什么区别呢？

hexo new page "my-second-blog"最终部署时生成：hexo\public\my-second-blog\index.html，但是它不会作为文章出现在博文目录。

代码高亮

hexo默认的代码高亮可能显示，可以自行使用highlight.js

Language names	aliases
1C	1c
ABNF	abnf
Access logs	accesslog
Ada	ada
ARM assembler	armasm, arm
AVR assembler	avrasm
ActionScript	actionscript, as
Apache	apache, apacheconf
AppleScript	applescript, osascript
AsciiDoc	asciidoc, adoc
AspectJ	aspectj
AutoHotkey	autohotkey
AutoIt	autoit
Awk	awk, mawk, nawk, gawk
Axapta	axapta
Bash	bash, sh, zsh
Basic	basic
BNF	bnf
Brainfuck	brainfuck, bf
C#	cs, csharp
C++	cpp, c, cc, h, c++, h++, hpp
C/AL	cal
Cache Object Script	cos, cls
CMake	cmake, cmake.in
Coq	coq
CSP	csp
CSS	css
Cap’n Proto	capnproto, capnp
Clojure	clojure, clj
CoffeeScript	coffeescript, coffee, cson, iced
Crmsh	crmsh, crm, pcmk
Crystal	crystal, cr
D	d
DNS Zone file	dns, zone, bind
DOS	dos, bat, cmd
Dart	dart
Delphi	delphi, dpr, dfm, pas, pascal, freepascal,lazarus, lpr, lfm
Diff	diff, patch
Django	django, jinja
Dockerfile	dockerfile, docker
dsconfig	dsconfig
DTS (Device Tree)	dts
Dust	dust, dst
EBNF	ebnf
Elixir	elixir
Elm	elm
Erlang	erlang, erl
Excel	excel, xls, xlsx
F#	fsharp, fs
FIX	fix
Fortran	fortran, f90, f95
G-Code	gcode, nc
Gams	gams, gms
GAUSS	gauss, gss
Gherkin	gherkin
Go	go, golang
Golo	golo, gololang
Gradle	gradle
Groovy	groovy
HTML, XML	xml, html, xhtml, rss, atom, xjb, xsd, xsl, plist
HTTP	http, https
Haml	haml
Handlebars	handlebars, hbs, html.hbs, html.handlebars
Haskell	haskell, hs
Haxe	haxe, hx
Hy	hy, hylang
Ini	ini
Inform7	inform7, i7
IRPF90	irpf90
JSON	json
Java	java, jsp
JavaScript	javascript, js, jsx
Leaf	leaf
Lasso	lasso, ls, lassoscript
Less	less
LDIF	ldif
Lisp	lisp
LiveCode Server	livecodeserver
LiveScript	livescript, ls
Lua	lua
Makefile	makefile, mk, mak
Markdown	markdown, md, mkdown, mkd
Mathematica	mathematica, mma
Matlab	matlab
Maxima	maxima
Maya Embedded Language	mel
Mercury	mercury
Mizar	mizar
Mojolicious	mojolicious
Monkey	monkey
Moonscript	moonscript, moon
N1QL	n1ql
NSIS	nsis
Nginx	nginx, nginxconf
Nimrod	nimrod, nim
Nix	nix
OCaml	ocaml, ml
Objective C	objectivec, mm, objc, obj-c
OpenGL Shading Language	glsl
OpenSCAD	openscad, scad
Oracle Rules Language	ruleslanguage
Oxygene	oxygene
PF	pf, pf.conf
PHP	php, php3, php4, php5, php6
Parser3	parser3
Perl	perl, pl, pm
Pony	pony
PowerShell	powershell, ps
Processing	processing
Prolog	prolog
Protocol Buffers	protobuf
Puppet	puppet, pp
Python	python, py, gyp
Python profiler results	profile
Q	k, kdb
QML	qml
R	r
RenderMan RIB	rib
RenderMan RSL	rsl
Roboconf	graph, instances
Ruby	ruby, rb, gemspec, podspec, thor, irb
Rust	rust, rs
SCSS	scss
SQL	sql
STEP Part 21	p21, step, stp
Scala	scala
Scheme	scheme
Scilab	scilab, sci
Shell	shell, console
Smali	smali
Smalltalk	smalltalk, st
Stan	stan
Stata	stata
Stylus	stylus, styl
SubUnit	subunit
Swift	swift
Test Anything Protocol	tap
Tcl	tcl, tk
TeX	tex
Thrift	thrift
TP	tp
Twig	twig, craftcms
TypeScript	typescript, ts
VB.Net	vbnet, vb
VBScript	vbscript, vbs
VHDL	vhdl
Vala	vala
Verilog	verilog, v
Vim Script	vim
x86 Assembly	x86asm
XL	xl, tao
XQuery	xpath, xq
Zephir	zephir, zep

hexo命令

常用命令

hexo new "postName" #新建文章
hexo new page "pageName" #新建页面
hexo generate #生成静态页面至public目录
hexo server #开启预览访问端口（默认端口4000，'ctrl + c'关闭server）
hexo deploy #部署到GitHub
hexo help  # 查看帮助
hexo version  #查看Hexo的版本

命令缩写

hexo n == hexo new
hexo g == hexo generate
hexo s == hexo server
hexo d == hexo deploy

组合命令

1 2	hexo s -g #生成并本地预览 hexo d -g #生成并上传

使用Github Pages和Hexo搭建博客

2019-06-19
工具