Hexo官网：https://hexo.io/zh-cn/
Hexo官方安装文档：https://hexo.io/zh-cn/docs/

了解Hexo优点

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

环境：Hexo 3.x
　　　Windows7 x64Bit

安装Git for Windows

Git for Windows下载地址：https://git-for-windows.github.io/
Git for Windows 2.11下载地址

安装Node.JS

Node.js是一个基于Chrome的V8 JavaScript引擎的JavaScript运行时环境
Node.JS for Windows下载地址：https://nodejs.org/en/
node.js-v7.5.0-x64.msi下载地址
旧版的Node.JS需要配置path环境变量，新版的在安装时会自动配置Path，即可以直接使用npm命令

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
C:\>npm --help
Usage: npm <command>
where <command> is one of:
    access, adduser, bin, bugs, c, cache, completion, config,
    ddp, dedupe, deprecate, dist-tag, docs, doctor, edit,
    explore, get, help, help-search, i, init, install,
    install-test, it, link, list, ln, login, logout, ls,
    outdated, owner, pack, ping, prefix, prune, publish, rb,
    rebuild, repo, restart, root, run, run-script, s, se,
    search, set, shrinkwrap, star, stars, start, stop, t, team,
    test, tst, un, uninstall, unpublish, unstar, up, update, v,
    version, view, whoami
    
npm <cmd> -h     quick help on <cmd>
npm -l           display full usage info
npm help <term>  search for help on <term>
npm help npm     involved overview
Specify configs in the ini-formatted file:
    C:\Users\yfshare\.npmrc
or on the command line via: npm <command> --key value
Config info can be viewed via: npm help config
npm@4.1.2 C:\Program Files\nodejs\node_modules\npm
C:\>

安装Hexo

打开Windows桌面上的Git shell

1
2
3
npm install hexo-cli -g  #安装到这里了C:\Users\yfshare\AppData\Roaming\npm
npm install -g cnpm --registry=https://registry.npm.taobao.org  #更换npm源
npm install hexo --save

初始化Hexo配置

创建Hexo文件夹
安装完成后，建立Data目录(随意，目录最好不要有空格特殊字符之类的)，进入 Git Shell 切换到 E:\GitHup_Data\GitHup\Hexo 执行下面的指令：

1
2
3
4
5
$ cd /E/GitHup_Data/Hexo_Blog/  #GitHup是bash环境，切换路径命令
$ hexo init
$ npm install
$ ls
_config.yml  node_modules/  package.json  scaffolds/  source/  themes/

安装Hexo插件

1
2
3
4
5
6
7
8
9
10
11
12
13
14
$ cd /E/GitHup_Data/Hexo_Blog/
$ npm install hexo-generator-index --save
$ npm install hexo-generator-archive --save
$ npm install hexo-generator-category --save
$ npm install hexo-generator-tag --save
$ npm install hexo-server --save
$ npm install hexo-deployer-git --save
$ npm install hexo-deployer-heroku --save
$ npm install hexo-deployer-rsync --save
$ npm install hexo-deployer-openshift --save
$ npm install hexo-renderer-marked@0.2 --save
$ npm install hexo-renderer-stylus@0.2 --save
$ npm install hexo-generator-feed@1 --save
$ npm install hexo-generator-sitemap@1 --save

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
$ hexo -v
hexo-cli: 1.0.2
os: Windows_NT 6.1.7601 win32 x64
http_parser: 2.7.0
node: 7.5.0
v8: 5.4.500.48
uv: 1.10.2
zlib: 1.2.8
ares: 1.10.1-DEV
modules: 51
openssl: 1.0.2k
icu: 58.2
unicode: 9.0
cldr: 30.0.3
tz: 2016j

本地验收

1
2
3
4
5
$ cd /E/GitHup_Data/Hexo_Blog/
$ hexo g  #生成public文件夹
$ hexo server
INFO  Start processing
INFO  Hexo is running at http://localhost:4000/. Press Ctrl+C to stop.

image

Hexo简写命令

1
2
3
4
hexo n #生成文章，或者source\_posts手动编辑
hexo s #本地发布预览效果
hexo g #生成public静态文件
#最后手动同步更新至GitHub

配置Hexo

参考官方文档：https://hexo.io/zh-cn/docs/configuration.html
在配置过程中请使用yamllint来保证自己的yaml语法正确

网站存放在子目录
如果您的网站存放在子目录中，例如 http://yoursite.com/blog ，则请将您的 url设为 http://yoursite.com/blog 并把 root 设为 /blog/

在本地的hexo目录下的source目录下新建CNAME文件，内容为youdomain

1
2
3
4
5
$ cd /e/GitHup_Data/Hexo_Blog/source/
$ ls
_posts/  CNAME
$ cat CNAME
https://yfshare.github.io/Hexo_Blog

Hexo主题设置
官方主题库：https://hexo.io/themes/
参考文档：http://jiji262.github.io/2016/04/15/2016-04-15-hexo-github-pages-blog/

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
$ cd /e/GitHup_Data/Hexo_Blog/themes
$ hexo clean
$ git clone https://github.com/luuman/hexo-theme-spfk
#修改Hexo目录下的_config.yml配置文件中的theme属性，将其设置为hexo-theme-spfk(新下载的主题)
$ grep -i '^theme' ../_config.yml
theme: landscape
$ sed -i '/^theme/s/landscape/hexo-theme-spfk/' ../_config.yml
$ grep -i '^theme' ../_config.yml
theme: hexo-theme-spfk
$
#更换主题
$ cd hexo-theme-spfk/
$ git pull
Already up-to-date.
$ cd /e/GitHup_Data/Hexo_Blog/
$ hexo g   #必须要切换到Hexo根目录才能执行hexo g命令，否则报错
$ hexo server  #同上

更换新主题成功
image

Github shell连接 Githup.com
参考：https://help.github.com/articles/connecting-to-github-with-ssh/
生成SSH KEY

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
$ ssh-keygen -t rsa -b 4096 -C "your_email@example.com"
Generating public/private rsa key pair.
Enter file in which to save the key (/c/Users/yfshare/.ssh/id_rsa):
Enter passphrase (empty for no passphrase):  #这里输入密码，Github的密码
Enter same passphrase again:
Your identification has been saved in /c/Users/yfshare/.ssh/id_rsa.
Your public key has been saved in /c/Users/yfshare/.ssh/id_rsa.pub.
The key fingerprint is:
SHA256:Vuxj3gxPJPaNv5/jUffiaSwsN2ufyCsyQ your_email@example.com
The key's randomart image is:
+---[RSA 4096]----+
|                 |
|         .  . .  |
|          =o.=   |
|        E+=+ooo  |
|        So==+.. o|
|       . o+B .  +|
|          .o++o..|
|          + O.=*o|
|          .O.BO=o|
+----[SHA256]-----+
$

1
2
3
4
5
$ cd ~/.ssh
$ ls
id_rsa  id_rsa.pub
$ cat id_rsa.pub   #github ssh公钥
ssh-rsa AAAAB3NzaC1yc2EAAAADAQABAAABAQDjABJRUmtfpxTOiaPlItHVbzmnTVTh1OhYP2uSu3mgsACthhuZ9pVQz44flE1KUSnPaxPiYOfUXkHQ/ZKeZY/xs2bLXQUglZHuAVopyhsmnUUZy4Ycz9cUw8meC2YfdIyBnUNgSt0cVRGEAaaO7gOfPqWRCcGW8m1493LD+YhPNIQkFyQK0BzUkkOkkCnpZkoQaUF7XYtmVcrN/Yg66Pwr0hSZKLqL4Q0fPYj9ZligiaE54FKQ9ORVJskrOuw8Xp/P2sdGlmbRMu9W9w6qOTlLw7KrctsqjM2Up7X20lzassdgqweqwda your_email@example.com

然后把生成的ssh key添加到Githup上
登录Githup – Settings – SSH and GPG keys — New SSH key
image 

1
2
3
4
$ ssh -T git@github.com   #登录GitHup
Enter passphrase for key '/c/Users/yfshare/.ssh/id_rsa':
Hi yfshare! You've successfully authenticated, but GitHub does not provide shell access.
#登录GitHup成功

部署静态网页到GitHub

Githup注册略，登录Githup
建立与你用户名对应的仓库，仓库名必须为[your_user_name.github.io]
登录GitHup – New repository – yfshare.github.io(Repository name)
等待审核通过后，访问：https://github.com/yfshare/yfshare.github.io
image

上传Hexo代码到Githup
参考：https://hexo.io/zh-cn/docs/deployment.html

1
2
3
4
5
6
7
8
9
10
$ pwd
/e/GitHup_Data/Hexo_Blog
$ tail -6 _config.yml
# Deployment
## Docs: https://hexo.io/docs/deployment.html
deploy:
  type: git
  repository: git@github.com:yfshare/yfshare.github.io.git
  branch: master
$ hexo deploy

image

访问：https://yfshare.github.io/
image
如果能打开网页就说明部署成功了

创建小文章：
参考：https://hexo.io/zh-cn/docs/writing.html

1
2
3
4
5
#写文档前需要把hexo停止，如果运行了hexo server的话，否则可能会生成2篇相同的文章
$ cd /e/GitHup_Data/Hexo_Blog
$ hexo new "使用GitHub+Hexo搭建免费静态Blog"
INFO  Created: E:\GitHup_Data\Hexo_Blog\source\_posts\使用GitHub-Hexo搭建免费静态Blog.md   #生成的.md文件使用支持markdown语法的编辑器来编辑文档，如：Sublime Text 3等
$ hexo server

再次访问http://localhost:4000时发现多了一篇文章
image

Sublime Text 3下载地址
参考：https://hexo.io/zh-cn/docs/configuration.html

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
$ cat source/_posts/使用GitHub-Hexo搭建免费静态Blog.md
---
title: 使用GitHub+Hexo搭建免费静态Blog
date: 2017-02-13 14:33:54
tags: [GitHub,Hexo]
---
This is a test page.
$ hexo g   #把markdown生成静态网页
INFO  Start processing
INFO  Files loaded in 760 ms
INFO  Deleted: tags/GitHub-Hexo/index.html
INFO  Generated: atom.xml
INFO  Generated: sitemap.xml
INFO  Generated: archives/index.html
INFO  Generated: archives/2017/02/index.html
INFO  Generated: 2017/02/13/hello-world/index.html
INFO  Generated: 2017/02/13/使用GitHub-Hexo搭建免费静态Blog/index.html
INFO  Generated: archives/2017/index.html
INFO  Generated: index.html
INFO  Generated: tags/Hexo/index.html
INFO  Generated: tags/GitHub/index.html
INFO  10 files generated in 259 ms

定制化博客：

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
#修改_config.yml
$ pwd
/e/GitHup_Data/Hexo_Blog
$ head -n 11 _config.yml | tail -7
# Site
title: Jack Wang Blog
subtitle:
description: Blog
author: Jack Wang
language: CN
timezone: "Asia/Shanghai"
#修改theme信息，即theme的_config.yml
$ cd themes/hexo-theme-spfk/
$ ls
_config.yml  languages/  layout/  package.json  README.md  source/
#简单修改
$ grep -v '#' _config.yml | grep -v ^$
menu:
  博客首页: /Home
  作品展示: /works
  留言打卡: /about
  前端导航: /FrontEndGuide
avatar: img/head.jpg
favicon: img/favicon.png
subnav:
  mail: "http://mail.qq.com/cgi-bin/qm_share?t=qm_mailme&email=Uyo1IDsyITYTNTwrPjI6P30wPD4"
  github: "https://yfshare.github.io/"
  QQ: "http://wpa.qq.com/msgrd?V=1&Uin=838554604"
disqus:
  shortname:
duoshuo:
  on: true
  domain:
youyan:
  id:
background:
  on: true
  background_sum: 24
  background_image: 109
highlight_style:
  on: true
  inline_code: 5
  code_block: 5
blockquote_style:
left_col_width: 300
toc_nowrap: false
animate: true
tagcloud: true
friends:
  name: http://luuman.github.io/
aboutme: 纯海迷、爱运动、爱交友、爱旅行、喜欢接触新鲜事物、迎接新的挑战，更爱游离于错综复杂的编码与逻辑中
open_in_new: false
rss: /atom.xml
fancybox: true
mathjax: false
baidushare: true
google_analytics:
baidu_analytics:
visit_counter:
  on: true
  site_visit: 海贼到访数
  page_visit: 本页阅读量
TipTitle: true
$

1
$ hexo deploy   #推送代码到Githup

访问：https://yfshare.github.io 即可
image

QQ邮箱开放平台

参考文档：http://www.cnblogs.com/zhcncn/p/4097881.html
　　　　　http://www.jianshu.com/p/05289a4bc8b2
　　　　　https://qiutc.me/post/使用hexo-github搭建静态博客.html
　　　　　https://wsgzao.github.io/post/hexo-guide/#
　　　　　https://xuanwo.org/2015/03/26/hexo-intor/
　　　　　http://jiji262.github.io/2016/04/15/2016-04-15-hexo-github-pages-blog/

本文出自”Jack Wang Blog”：http://www.yfshare.vip/2017/02/13/使用GitHub-Hexo搭建免费静态Blog/