跳到正文
汉松札记
返回

用 hexo 搭建 github 博客

技术笔记

背景

搭建环境:Linux,nodejs,npm,git

现在网上已经有很多关于搭建 hexo github 博客的文章,我自己也是参考别人的文章过来的,但是现在 hexo 已经到了 3.0 版本,很多教程都过时了,而且感觉他们教程的思路着重于怎么做,并没有说明背后的原因,所以我希望写一篇着重于为什么,而不是怎么做的文章。我相信只有理解背后的原理才能更好更快的上手。

其次,最好的教程就是官方文档,所以在这篇文章我引用的都是官方文档的内容,而且只是提供思路,不提供详细步骤。因为版本更新之后,操作是不一样的,官方文档会随时更新,但是这篇文章不一定会随时更新,然而思路是不变的,所以我极力推荐大家首先阅读官方文档。

什么是 Github Page

首先,所谓的 github 博客是通过 github page 来实现的。

简单的说,Github 是一个具有版本管理功能的代码仓库,每个项目都有一个主页,列出项目的源文件。

但是对于一个新手来说,看到一大堆源码,只会让人头晕脑涨,不知何处入手。 他希望看到的是,一个简明易懂的网页,说明每一步应该怎么做。

因此,github 就设计了 Pages 功能,允许用户自定义项目首页,用来替代默认的源码列表。

所以,github Pages 可以被认为是用户编写的、托管在 github 上的静态网页。

什么是 Hexo

Hexo 是一个快速、简洁且高效的博客框架。Hexo 使用 Markdown(或其他渲染引擎)解析文章,在几秒内,即可利用靓丽的主题生成静态网页。

我们主要是用 hexo 在本地写博客,然后上传到 github page,就像你 commit 项目代码到 github 一样。

操作

建立一个 Github page

首先注册个 github 账户,然后在本地配置 ssh 到 github,这一步自行 google.

Create a repository

Head over to GitHub and create a new repository named username.github.io, where username is your username (or organization name) on GitHub.

If the first part of the repository doesn’t exactly match your username, it won’t work, so make sure to get it right.

官方教程主要强调命名项目的格式,即一定要命名为 username.github.io 同时,建完项目之后不要进行任何操作。我们可以直接用 hexo 初始化项目。

安装配置 hexo

这一步强烈推荐看Hexo 官方文档,现在很多网上的安装过程是过时的,现在 hexo 是 3.0 了。 请耐心的看完官方文档以下内容

官方文档目录

由于 hexo3.0 很多功能都插件化了,包括 git 上传,server 功能。 所以我们要把博客上传到 github 就需要先装 git 插件,详细见部署(切记要根据文档配置 config.yml) 以下是常用插件

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-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

在命令行执行即可

用 hexo 写作 github 博客的流程

注意:hexo 是用 markdown 来写作的,以下命令都是博客所在目录执行

  1. hexo new “title” 新建一篇文章,然后编辑相应的 md 文件 具体使用查看写作
  2. hexo clean 清除缓存
  3. hexo generate 根据写作的内容和配置生成网页 生成文章在 public 文件夹中,上传到 github 的就是里面的内容 具体使用查看生成器
  4. hexo deploy 上传到 github 具体使用查看部署
  5. 访问 username.github.io 查看内容

hexo 与 github 的关系

hexo 是一个博客框架,给我们提供了基于 markdown 的语法,帮助我们自动生成博客。

由于 github 提供了 github page 的功能,那么我们可以把生成的博客网页放在 github 上,供大家访问。

也就是说 github 就像是一个网站空间,由于 hexo 自带对 github 的支持,可以直接 commit 内容到 github 上,也就是说我们可以把 hexo 当做集成了写作和 ftp 发布功能的软件。

hexo 的主题

hexo 有丰富的主题支持,本博客用的就是jacman

更多主题查看主题

总结

整个部署流程如下

总的来说,刚开始配置就是一直在折腾,需要有足够的耐心,可能大家都喜欢看别人一步步的详细的步骤,自己只要复制粘贴就行了。但是有时候即使你完全照着做也会出问题的,因为版本和环境不一样。

一开始我也是这样,后来才发现,最好的方法是查看别人做的思路,然后去找官方的文档。这样遇到的问题会大大减少,有时候你纠结半天的问题可能只是版本不一样。就像前面 deploy 部署,所有文章都是没有提到要先装

npm install hexo-deployer-git --save

因为 hexo3.0 把它插件化了,然后我在官方文档找到了答案。 最后提示一下:如果运行命令出现什么问题,加上 sudo 试试看看,里面有些需要 root 权限 (例如说sudo hexo server)

仅以此文记录折腾 hexo 的过程,并且希望给后来者有参考价值。

最后推荐一篇极其详细的使用 hexo 的文章hexo 你的博客 里面的搭建流程是 hexo2.0 的,最好参考官方文档 3.0 的方法

补充

关于草稿的使用方法

官方文档关于草稿的使用没有说的很清楚,我根据自己的使用情况作一些介绍。


订阅 技术笔记

分享这篇文章:


上一篇
算法学习之算法基本概念