前言
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
此脚本可以自动修改配置,根据自己需要选择即可。