用Hugo搭建博客

发表于： 2020-10-24

字数： 921 阅读：≈ 2分钟浏览：

前言

关于博客的创建，折腾过很多框架， hexo 、 Gridea 、最后使用了 hugo 。hexo依赖Node.js，庞大node_modules安装和运行相对来说都不如hugo快速，至于Gridea，一开始用的时候发现这个用起来真舒适，只要下载客户端后，配置一下即可，剩下的就编写博客了，后来从windows换到mac的时候发现，Gridea不支持迁移，完全要自己手动搬运。至此，决定试试hugo，感觉还不错。

搭建

安装Hugo

Mac下直接使用Homebrew安装：

brew install hugo

window下下载安装包，配置环境变量即可

生成站点

使用Hugo快速生成站点，比如想创建的项目名为blog的项目：

hugo new site ./blog

这样就在当前目录生成了一个blog的站点，进去目录：

cd blog

目录结构如下：

> blog/ # 根目录
  > themes/ # 主体目录
  > static/ # 静态文件
  > layouts/ # 布局模版
  > i18n/ # 字体
  > data/ # 目录用来存储Hugo生成网站时应用的配置文件
  > content/ # 博客md文件
  > assets/ #
  > archetypes/ # 预设置的文件模板头部
    hugo.toml # 配置

创建博客

创建第一篇文章，放到post目录

hugo new post/first.md

打开编辑post/first.md

---
title: "hello world"
date: 2020-10-24T15:51:17+08:00
draft: true
---

# hello world
1. 第一篇文章
2. 加油

安装皮肤主题

到皮肤列表找一个中意的皮肤，为方便日后皮肤更新，可以使用git submodule的方式添加到站点中：

git submodule add https://github.com/adityatelange/hugo-PaperMod.git themes/hugo-PaperMod

注：如果网站要部署到Gitee pages中，上面的github要换成gitee的
git submodule add https://gitee.com/duchenpaul/hugo-PaperMod.git themes/hugo-PaperMod

更新皮肤主题：

git submodule update --remote --merge

配置皮肤主题： hugo.toml需要按照各自主题的配置即可。如果需要区分环境，比如站点不是配置到根目录而是子目录/blog之下，把么就需要在开发环境时baseURL: /，而部署后的生产环境为baseURL: /blog，这个时候只需要在根目录创建以下目录结构：

> blog/
  > config/
    > _default/
        config.yaml
    > production/
        config.yaml
  > ...

_default下的配置是默认的，当部署至生产环境时，会被production下的配置覆盖

运行Hugo

在项目根目录下运行：

hugo server

浏览器打开：http://localhost:1313，就可以看到效果了。

部署

之前部署在github上，国内访问慢，现在可以配置在gitee上面，运行：

hugo

静态页面会生成到public目录，push代码到gitee，在gitee上面开启Gitee pages，博客就搭建完成了。