hexo搭建github技术博客

简介

之前在CSDN写过几篇博客，但是一直觉得界面不够简洁，写博客的时候不太爽，想自己搭个人博客写，趁这个机会接触了hexo，记录下来。

PS: 以下过程是以Windows系统，大多数参考手把手教你建github技术博客，我按照自己的实际情况重新整理了一下。用Mac OS的同学可以参考20分钟教你使用hexo搭建github博客。

安装

下载 git 和 Node.js 并执行安装

安装hexo

NPM是随同NodeJS一起安装的包管理工具，能解决NodeJS代码部署上的很多问题，常见的使用场景有以下几种：

允许用户从NPM服务器下载别人编写的第三方包到本地使用。
允许用户从NPM服务器下载并安装别人编写的命令行程序到本地使用。
允许用户将自己编写的包或命令行程序上传到NPM服务器供别人使用。

由于新版的Node.js已经集成了npm，所以之前npm也一并安装好了。Windows我比较喜欢用PowerShell，包含了一些Linux的命令，也可以用vim。
然后使用npm安装hexo：

npm install -g hexo

安装过程中我是出现了一个warning：This package is no longer maintained，暂时可以无视。

创建hexo文件并安装依赖包

安装完成后，在该文件夹内执行以下命令，将在当前目录建立网站所需要的所有文件

hexo init

看到：

INFO    Start blogging with Hexo!

说明建立完成，执行以下命令，安装所需依赖：

npm install

本地浏览

hexo generate
hexo server

这里hexo默认用的是本地的4000端口，我第一次开启后发现访问不了，想了一下应该是已经被占用了，查询：

netstat -aon | grep 4000
tasklist | grep 上条命令结果最后的PID

是福昕，所以手动改下端口：

hexo s -p 5000

这里的s是server的缩写，下面会给出常用的缩写，在上面的命令执行后，浏览器访问：127.0.0.1:5000，可以看到本地的博客已经搭建起来了。下面我们要做的是部署到GitHub上。

新建网站项目目录

注意格式，yourname.github.io

生成SSH密钥并添加

ssh-keygen -t rsa -C "你的邮箱地址"，按3个回车，密码为空。

在C:\Users\Administrator.ssh下，得到两个文件id_rsa和id_rsa.pub。打开id_rsa.pub，复制全文。Add SSH key，粘贴进去。

hexo目录结构

├── .deploy #需要部署的文件
├── node_modules #Hexo插件
├── public #生成的静态网页文件
├── scaffolds #模板
├── source #博客正文和其他源文件，404、favicon、CNAME 都应该放在这里
| ├── _drafts #草稿
| └── _posts #文章
├── themes #主题
├── _config.yml #全局配置文件
└── package.json

全局配置 _config.yml

# Hexo Configuration
## Docs: http://hexo.io/docs/configuration.html
## Source: https://github.com/hexojs/hexo/
# Site #站点信息
title:  #标题
subtitle:  #副标题
description:  #站点描述，给搜索引擎看的
author:  #作者
email:  #电子邮箱
language:  #语言
# URL #链接格式
url:  #网址
root: / #根目录
permalink: :year/:month/:day/:title/ #文章的链接格式
tag_dir: tags #标签目录
archive_dir: archives #存档目录
category_dir: categories #分类目录
code_dir: downloads/code
permalink_defaults:
# Directory #目录
source_dir: source #源文件目录
public_dir: public #生成的网页文件目录
# Writing #写作
new_post_name: :title.md #新文章标题
default_layout: post #默认的模板，包括 post、page、photo、draft（文章、页面、照片、草稿）
titlecase: false #标题转换成大写
external_link: true #在新选项卡中打开连接
filename_case: 0
render_drafts: false
post_asset_folder: false
relative_link: false
highlight: #语法高亮
  enable: true #是否启用
  line_number: true #显示行号
  tab_replace:
# Category & Tag #分类和标签
default_category: uncategorized #默认分类
category_map:
tag_map:
# Archives
2: 开启分页
1: 禁用分页
0: 全部禁用
archive: 2
category: 2
tag: 2
# Server #本地服务器
port: 4000 #端口号
server_ip: localhost #IP 地址
logger: false
logger_format: dev
# Date / Time format #日期时间格式
date_format: YYYY-MM-DD #参考http://momentjs.com/docs/#/displaying/format/
time_format: H:mm:ss
# Pagination #分页
per_page: 10 #每页文章数，设置成 0 禁用分页
pagination_dir: page
# Disqus #Disqus评论，替换为多说
disqus_shortname:
# Extensions #拓展插件
theme: #主题
exclude_generator:
plugins: #插件，例如生成 RSS 和站点地图的
- hexo-generator-feed
- hexo-generator-sitemap
# Deployment #部署，将 lmintlcx 改成用户名
deploy:
  type: git
  repo: 刚刚github创库地址.git
  branch: master

注意：

冒号:后面都有一个空格
repo: 刚刚github创库地址.git

hexo常用命令

hexo help #查看帮助
hexo init #初始化一个目录
hexo new "postName" #新建文章
hexo new page "pageName" #新建页面
hexo generate #生成网页，可以在 public 目录查看整个网站的文件
hexo server #本地预览，'Ctrl+C'关闭
hexo deploy #部署.deploy目录
hexo clean #清除缓存，**强烈建议每次执行命令前先清理缓存，每次部署前先删除 .deploy 文件夹**

简写

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

新建文章

hexo new "标题"

在 _posts 目录下会生成文件标题.md

---
title: Hello World
date: 2015-07-30 07:56:29 #发表日期，一般不改动
categories: hexo #文章文类
tags: [hexo,github] #文章标签，多于一项时用这种格式
---

正文，使用Markdown语法书写，编辑完后保存，hexo server 预览

部署

执行下列指令即可完成部署。

1 2	hexo generate hexo deploy

这里我deploy时，没有成功，出现了一个错误

ERROR Deployer not found: git

原来是需要装这个：

npm install hexo-deployer-git --save

再执行，出现以下提示，说明部署完成：

[info] Deploy done: git

点击 Github 上项目的 Settings，GitHub Pages，提示Your site is published at https://rexking6.github.io/ (这是我自己的)

总结

在搭建博客的过程中，发现hexo真是简单好用啊，对于我这种没学过前端的，真是神器啊。也体会到了github能部署网站的厉害之处，之后想把两个网站来作个部署记录，还有绑定阿里域名和图床，也都会写出来。