搭建hexo + github pages + 独立域名博客

2017-04-26

Hexo，一个快速、简洁且高效的博客框架，Hexo 使用 Markdown（或其他渲染引擎）解析文章，在几秒内，即可利用靓丽的主题生成静态网页。只需一条指令即可部署到 GitHub Pages, Heroku 或其他网站。Hexo 支持 GitHub Flavored Markdown 的所有功能，甚至可以整合 Octopress 的大多数插件。Hexo 拥有强大的插件系统，安装插件可以让 Hexo 支持 Jade, CoffeeScript。

[TOC]

一、环境准备

安装nvm
安装nodejs
安装git
申请github账号
- 新建仓库 name.github.io（name与账号同名）
- 配置ssh本地免密码推送

nvm安装备忘

nvm全名node.js version management，顾名思义是一个nodejs的版本管理工具。通过它可以安装和切换不同版本的nodejs。

# https://github.com/coreybutler/nvm-windows/releases
# 注意：node.js版本管理工具nvm的安装及使用，需要注意的是安装路径不要出现中文和空格。
nvm install latest
nvm list
17.1.0
nvm use 17.1.0
nvm uninstall 17.1.0

1 2	乱码（exit status 145）：安装路径不能有空格和中文，且必须在根目录下报错exit status 1：

二、安装hexo

1、切换npm源

npm config set registry https://registry.npm.taobao.org

2、安装hexo

npm install -g hexo

3、设置windows的path路径

找到刚刚npm安装完成的hexo路径，有如下的文件：

hexo
hexo.cmd

右击电脑_>属性->高级系统设置->环境变量（N）…->系统变量（S）-> 双击path添加路径hexo命令的路径地址如：我的地址为：D:\runtime\nodejs\node_data\node_global

# 测试，是否成功。执行这条命令不报commond not found即可

hexo -v

4、初始化hexo

mkdir hexo_test

cd hexo_test

hexo init

5、安装hexo依赖包

npm install

6、生成、启动服务

hexo generate
hexo server

# Debug方式启动本地服务
hexo s –debug

7、查看hexo是否安装成功

http://localhost:4000/

三、完整搭建过程【github + 独立域名】

1、本地初始化hexo环境

mkdir hexo_blog
cd hexo_blog
hexo init
npm config set registry https://registry.npm.taobao.org
npm install

2、github配置

新建仓库
登陆github，单击+号创建新仓库，比较重要两点是：

Repository name必须以github.io结尾；
前缀必须与Owner一致，owner.github.io

举例：我的https://github.com/fbli对应的仓库名称为fbli.github.io

本地免密码提交git设置

默认情况下，每次推送hexo动态生成的静态页面到刚刚创建的github仓库时需要输入用户名/密码，但是可以通过本地生成密钥的方式来实现免密码推送，且更安全。只要将本地生成的公钥保存到github即可，具体实现步骤如下：

本地生成rsa

1 2	# 输入如下命令，一路回车即可 ssh-keygen -t rsa -C "mail@abc.com"

windows默认会再c:/Users/Administrator/.ssh/文件夹中生成三个文件（Administrator是你的账户名）

known_hosts
id_rsa # 私钥
id_rsa.pub # 公钥需要保存至github

github保存ssh key
单击头像->settings->SSH keys and GPG keys->SSH keys_单击[new SSH keys] 添加id_rsa.pub公钥的文本内容

3、hexo配置_config.yml

比较关键的是# Deployment那处需要跟自己的github新创建的repository对应起来。其他更详细的配置可以参照官网API

# Site
title: 博客
subtitle: 生活美好，美好生活
description: 在哪里跌倒 就在哪里躺下
author: Lee
language: zh-CN
timezone: Asia/Shanghai

# Deployment
## Docs: https://hexo.io/docs/deployment.html
deploy:
  type: git
  repo: git@github.com:fbli/fbli.github.io.git
  branch: master

# Extensions
# 官方默认主题，可以找自己比较喜欢的主题随意切换
theme: landscape

4、域名绑定

1、新建CNAME文件，放到hexo_blog\source\下，内容为不带www的域名如：ezsay.cn
2、配置域名解析

CNAME www fbli.github.io
CNAME @ fbli.github.io

问题：能转向github，但是显示404。初次发布后，停10分钟再试，githubPages需要一定的时间

5、发布到git上

# 发布到git上
hexo d
# 发布前先重新生成，如下两个命令都可以
hexo d -g
hexo g -d

6、访问跟刚才仓库名一致的域名即可看到自己的博客了

7、个性化-更换主题

yilia主题在github上搜索hexo themes排名第二[201705]有如下特点：

优点：

看着自然舒服
没有花里胡哨的效果
文章的tag效果漂亮

缺点：

无站内全文搜索
无文章目录导航
菜单单调没法加图标
字体中规中矩不够骚
【所有文章】背景字体配搭模糊不清
友情链接很丑
more处理的感觉有点别扭
markdown的列表与上面一行的距离太长，效果很差

# 更换主题前必须clean
cd hexo_blog
hexo clean
# 此处有坑，默认的主题文件夹名需要改一下
git clone git@github.com:litten/hexo-theme-yilia.git themes/yilia
cd themes/yilia
npm install
# 返回到hexo根目录
cd ../../
# 重新生成
hexo g
hexo s
http://localhost:4000/
# 发布至github
hexo d

四、Hexo常用命令汇总

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

Hexo命令简写

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

博客搭建软件环境版本

环境	版本
node	v6.10.2
npm	3.10.10
hexo	3.3.1
git	2.10.2.windows.1
os	win10
yilia	未知

更详细的配置信息

hexo: 3.3.1
hexo-cli: 1.0.2
os: Windows_NT 10.0.15063 win32 x64
http_parser: 2.7.0
node: 6.10.2
v8: 5.1.281.98
uv: 1.9.1
zlib: 1.2.11
ares: 1.10.1-DEV
icu: 58.2
modules: 48
openssl: 1.0.2k