前言

动态博客需要部署在云服务器上，一般需要搭配域名使用。对我而言，并不常用以上的在线服务，所以更倾向使用静态博客。Hexo 和 Hugo 的区别不大，但是 Hexo 需要 nodejs 环境并且加载速度没有 Hugo 快，优点是 Hexo 的主题更多。在探索阶段也尝试过Vuepress-theme-hope和基于vuepress的vanblog，感觉不够快。

最终选择使用 Hugo + PaperMod 主题的方案搭建了静态博客。

快速启动

参考 Hugo 官网的指导。

安装Hugo

在 Windows 中，推荐使用 scoop 来安装预编译的二进制版本。

1

scoop install hugo-extended

安装完之后，执行命令看一下版本信息，

1

hugo version

初始化博客

新建站点目录 Sakuracedia，并将站点配置文件改为.yaml后缀写法：

1

hugo new site Sakuracedia --format yaml

hugo new site [path] [flags] --format 来选取构建的首选文件格式（toml、yaml 或 json）（默认为 “toml”）。

可以看到默认创建的一些文件和目录。

1
2

cd Sakuracedia
tree . /f

目录结构详细介绍参考：directory-structure

添加 PaperMod 主题

  1. 将此目录初始化成 git 仓库：
1

git init
  1. 往 thems 目录下添加主题， .gitmodules 记录添加主题的模块信息。
1
2

git submodule add --depth=1 https://github.com/adityatelange/hugo-PaperMod.git themes/PaperMod
git submodule update --init --recursive # needed when you reclone your repo (submodules may not get cloned automatically)

新建文章

在站点目录下，新建文章：

1

hugo new posts/first-blog.md

此时 first-blog.md 将自动生成在 content/posts 目录下。

预览博客

在站点目录下，执行命令：

1

hugo server -D --navigateToChanged --disableFastRender --renderToMemory
  • -D --buildDrafts：本地调试模式
  • --navigateToChanged：在更改某个页面后自动跳转查看该页面
  • --disableFastRender：在更改时重新构建整个网站
  • --renderToMemory：不开启的话会直接在 /public 输出网站静态文件

本人不想每次输代码启动预览服务器，根目录运行新建的 shell 脚本，scripts/blog.bat：

1
2
3

@echo off
echo Previewing the blog...
hugo server -D --navigateToChanged --disableFastRender --renderToMemory

进入 http://localhost:1313/ 即可访问个人主页。

配置 PaperMod 主题

Hugo 使用 hugo.toml, hugo.yaml, 或者 hugo.json（如果位于站点根目录中找到）作为默认的站点配置文件。

本人不想把所有东西全部塞进一个文件中，想分层去修改，于是看了下官方教程，有配置目录的方法，于是把 hugo.yaml 拆成目录。

可以使用 configDir 目录（默认为 config/）来组织和管理特定环境设置。

参考配置目录
 1
 2
 3
 4
 5
 6
 7
 8
 9
10

config
├─ 📁production
│  ├─ 📄hugo.yaml
│  └─ 📄params.yaml
└─ 📁_default
   ├─ 📄hugo.yaml
   ├─ 📄markup.yaml
   ├─ 📄menus.yaml
   ├─ 📄outputs.yaml
   └─ 📄params.yaml

当运行 hugo --environment staging 时，Hugo 将使用 config/_default 中的所有设置，并将 staging 的设置与之合并。

默认情况下，当运行 hugo server 时，Hugo 将其 environment设置为 development。在没有 config/development 目录的情况下，Hugo 使用 config/_default 目录。

参考教程