前言

Hugo是什么?

Hugo是一种通用的网站框架。严格来说,Hugo应该被称作静态页面生成引擎。

正文

我是在VPS上安装的Hugo,使用的系统是Debian testing,根据系统和环境的不同,需做适当调整。

安装Hugo:

apt install hugo

建立自己的网站,mysite(可以任意命名)是网站路径:

hugo new site mysite

进入该路径:

cd mysite

在该目录下你可以看到以下几个目录和 config.toml 文件:

- archetypes/
- content/
- layouts/
- static/
  config.toml

这几个文件的作用分别是:

  • archetypes:包括内容类型,在创建新内容时自动生成内容的配置
  • content:包括网站内容,全部使用markdown格式
  • layouts:包括了网站的模版,决定内容如何呈现
  • static:包括了css, js, fonts, media等,决定网站的外观
  • config.toml: 网站配置文件,包含 baseURL、title 等

Hugo 提供了完整的主题可以使用,可以在 Hugo themes 下载这些主题使用,比如我使用的是 hyde-hyde :

git clone https://github.com/htr3n/hyde-hyde.git themes/hyde-hyde

此时会下载主题文件存放在 themes/hyde-hyde 文件夹中。

现在我们创建新页面:

hugo new about.md

进入 content/ 文件夹我们可以看到,多了一个 about.md 文件,打开可以看到时间、文件名等信息已经自动加到文件开头

---
+++
date = "2015-02-01T18:19:54+08:00"
draft = true
title = "about"

+++

# 关于我
- NAME
- EMAIL

添加了一点内容,然后运行Hugo:

hugo server -t hyde-hyde --buildDrafts

-t 参数的意思是使用 hyde-hyde 主题渲染我们的页面,about.md 目前是作为草稿,即 draft 参数设置为 true ,运行Hugo时要加上 --buildDrafts 参数才会生成被标记为草稿的页面。 在浏览器输入 localhost:1313 ,就可以看到我们刚刚创建的页面。

注意观察当前目录下多了一个文件夹 public/ ,这里面是Hugo生成的整个静态网站,如果使用Github pages来作为博客的Host,你只需要将public/里的文件上传就可以,这相当于是Hugo的输出。

详细内容请参考Nanshu-Hugo静态网站生成器中文教程

配置 web server:

(1)利用Hugo本身的 web server

在你的站点目录(比如例子中的mysite)执行:

hugo server --bind="0.0.0.0" -v -w -p 80 -b http://server.org

但是这样如果服务器重启的话,每次都需要手动执行这条命令,非常繁琐,这里我们可以利用 Systemd,写一个Hugo的启动服务。编辑/etc/systemd/system/hugo.service

[Unit]
Description=Hugo Service

[Service]
ExecStart=/usr/bin/hugo server -s /home/sun/mysite --bind="0.0.0.0" -v -w -p 80 -b http://www.server.org

[Install]
WantedBy=multi-user.target

然后执行:

systemctl enable hugo.service

至此Hugo就可以自动启动了。

(2)利用 Nginx 反代 hugo server

同(1),利用systemd启动Hugo server,编辑/etc/systemd/system/hugo.service

[Unit]
Description=Hugo Service

[Service]
ExecStart=/usr/bin/hugo server -s /home/sun/mysite -w -b https://www.server.org --appendPort=false --disableLiveReload

[Install]
WantedBy=multi-user.target

安装Nginx:

apt install nginx

配置Nginx,编辑/etc/nginx/conf.d/hugo.conf

server {
    listen       80;
    listen       [::]:80;
    server_name  www.server.org;
    root /opt/myblogs;
    location ^~ / {
        proxy_set_header   X-Real-IP $remote_addr;
        proxy_set_header   Host      $http_host;
        proxy_pass         http://127.0.0.1:1313/;
    }
}

重载Nginx

nginx -s reload

配置https,使用Let’s Encrypt的免费证书:

apt-get install python-certbot-nginx
certbot --nginx

此脚本可以自动修改配置,根据自己需要选择即可。