最开始搭建博客的时候用的是 Hexo，相对其他的静态博客框架，Hexo 的搭建确实够简单，主题也够丰富。但是上个周末花了两天时间把框架从 Hexo 换到了 Hugo。原因有二：

  • Hexo 生成静态文件的速度
  • Hexo 是基于 Node.js 的，而从 mpn 上下载插件太容易出各种问题了。尤其是当你的 node 版本太高的时候

当然，最主要的原因其实是：Hexo 的更新简直是一场噩梦。所以决定将博客的框架换为 Hugo。一个是性能够好，另一个是安装够简单

Hugo 安装+使用

  • 安装 Hugo 非常简单，直接在官网下载安装包。或者用 Homebrew:
$ brew update && brew install hugo
  • 创建新博客
$ hugo new site xxBlog

.
|-- archetypes
|-- config.toml
|-- content
|-- data
|-- layouts
`-- static

5 directories, 1 file

Markdown 文件放在 content 文件夹下。配置内容放在 config.toml 里。不同于 Hexo 的 YAML，Hugo 使用了 TOML 作为配置的格式。具体的配置选可以在这里找到。需要注意的是，中文博客需要设置hasCJKLanguage = true

  • 配置代码高亮

Hugo 的代码高亮有两种方式，一个是生成静态文件时加上高亮，另一个是通过在页面上加上 js

第二种方法需要修改 Theme 下的 header.html。所以我用的是第一种方法。

安装 Pygments

pip install Pygments

安装完之后，可以在 terminal 里面输入pygmentize，如果没有这个命令。需要将这个命令加到 PATH 里面。

之后，需要在 config.toml 里面添加pygmentsUseClasses = true，自定义高亮格式pygmentsStyle = ""

  • 添加文章

在 xxBlog 文件夹下面输入

$ hugo new xxx.md

然后就可以编辑 Markdown 文件了。当然，这里每篇文章的 frontmatter 也是用 TOML 格式的。如果是从 Hexo 迁移过来也需要修改一下

  • 生成静态文件并预览

在 xxBlog 文件夹下面生成静态文件

$ hugo

本地预览

$ hugo serve

访问http://localhost:1313/访问

另外，相比 Hexo 的一键部署到 GitHub Page，Hugo 需要手动将 /public/文件夹 中的内容传送到 Github 仓库。这里就不细讲了