使用Hexo及GitHub搭建个人博客记录

记录本人使用Hexo框架在GitHub平台上搭建个人博客的过程。Hexo 是一个快速、简洁且高效的博客框架。Hexo 使用 Markdown(或其他渲染引擎)解析文章,在几秒内,即可利用靓丽的主题生成静态网页。GitHub是一个利用Git进行版本控制、专门用于存放软件代码与内容的共享虚拟主机服务。Hexo在本地可以一键轻松建立站点,并通过简单的配置,将站点部署到GitHub平台上。本文系统为WIN7 32位,需要用到以下环境:

环境准备

我们需要搭建Hexo环境,以及配置Git环境(向GitHub上部署博客站点时需要)

Hexo环境搭建

Hexo框架是Node.js框架下的一个包,在windows上一键安装Node.js环境后,使用Node.js下的包管理工具npm即可一键安装Hexo框架,命令如下:

npm install -g hexo

Hexo教程官网上使用的命令是npm install -g hexo-cli,而本人在实际操作过程中使用该命令安装hexo-cli后,在创建站点(后续章节介绍)执行npm install命令时出现下图错误,改用npm install -g hexo安装完整Hexo后,则没有问题。
"建站报错"

Git环境准备

在Git for Windows安装完成后,就具备了本地的git环境,我们需要做的是连接到我们的GitHub上,需要以下步骤:
1.创建GitHub账号(已有忽略本步骤)
2.在git bash窗口下,设置Git的account和email

git config –global user.name “github account”
git config –global user.email “email used in github”

3.生成秘钥

ssh-keygen -t rsa -C “your email address”

此步骤会有多个输入,连续回车即可。最后会在系统盘的用户目录下生成一个.ssh目录,里面包含id_rsa和id_rsa.pub两个文件。

4.登入GitHub,add SSH key
在用户的设置里面,添加SSH key,将id_rsa.pub文件里面所有的内容都拷贝进去,title可以不用设置。
add ssh key

5.测试
使用ssh -T git@github.com测试是否连接成功。
"连接成功"

自此,博客站点所需要的环境配置完成。

站点配置并部署到GitHub

创建站点

使用几条Hexo框架命令即能完成,生成站点目录结构

  • hexo init <folder>
  • cd <folder>
  • npm install

folder可有可无,若不填写,则将站点部署在当前目录下,第二条语句也不需要执行。
"目录结构"

node_modules: Hexo框架渲染页面等用到的一些包
public:包含Hexo框架生成的静态页面
scffolds:创建页面是用到的模板,默认有post、page、draft
source:markdown文件等
themes:站点主题目录
_config.xml: 站点配置文件

创建站点完成,依次用hexo generate命令生成静态页面,和用hexo server启动站点,即可在localhost:4000上看到Hexo默认的hello world页面。

常用配置

 一目了然的就不说了,介绍几个主要的,大多数配置使用默认即可

  • permalink:文章的链接URL格式,默认如下2016/01/19/文章名,可自行修改
  • new_post_name:采用hexo new新建一篇文章时markdown文件的命名格式
  • theme: 采用的主题,对应到themes目录下的主题
  • deploy: 部署站点,如到GitHub平台下的参数
    • type: git
    • repository:GitHub下的库地址
    • branch:分支名称

将站点部署到GitHub

1.在GitHub上创建一个新库,命名为:账号名.github.io
2.填写deploy下属性的值,如上,branch可填master分支
3.生成静态文件

hexo generate

4.部署到GitHub

hexo deploy

设置评论

本人是先更换主题,然后在设置评论的,这里也只记录下自己的操作。

主题更换

下载相应的主题到themes目录下,然后在站点的配置文件下_config.xmltheme:该为你的主题名字即可。

开启评论

以多说评论为例,本人使用的yelee已经将必要的代码都放到了主要文件里,引入评论模块的代码在article.ejs下,评论模块代码则放置在comments文件加下。

参考资料:Hexo中文文档, git-ssh 配置和使用, 为 Hexo 主题添加评论模块

文章目录
  1. 1. 环境准备
    1. 1.1. Hexo环境搭建
    2. 1.2. Git环境准备
  2. 2. 站点配置并部署到GitHub
    1. 2.1. 创建站点
    2. 2.2. 常用配置
    3. 2.3. 将站点部署到GitHub
  3. 3. 设置评论
    1. 3.1. 主题更换
    2. 3.2. 开启评论