搭建hugo博客并在服务器上部署

关于Hugo

Hugo 是一个用 Go 开发的静态网站生成器,可以将 Markdown 内容和主题快速生成高性能静态网站,无需复杂依赖。

我的目的是在win系统编写md文档,上传到服务器部署。

Windows

安装 Hugo

Hugo有两个版本:标准版和扩展版,扩展版包含标准版功能,建议安装扩展版。

  • Scoop方式安装:
1
scoop install hugo-extended
  • 手动安装:
  1. 前往Hugo下载最新.zip

  2. 解压放自定义位置

  3. 配置环境变量

显示版本号即为安装成功:

1
hugo version

创建博客项目

1
2
3
hugo new site hugo-blog #其中myblog为自定义名称
cd hugo-blog
git init

添加主题

进入 Hugo 官方主题库,找到一款自己喜欢的主题。

  • 命令行
1
2
git clone https://github.com/CaiJimmy/hugo-theme-stack.git themes/hugo-theme-stack
echo 'theme = "hugo-theme-stack"' >> hugo.toml #其中hugo-theme-stack为自定义文件夹名称
  • 手动下载

    1
    2
    3
    
    1. 下载.zip
    2. 解压到themes文件夹
    3. 在hugo.toml文件中添加theme = "themename" #其中themename为解压后的文件夹名称
    

4预览

1
hugo server

启动后即可在http://localhost:1313/进行查看。

添加文章

正常来说hugo的文章放在content目录下就能编译显示了。

1
hugo new post/first.md

进入目录打开文章就能看到hugo的模板内容

介绍-D


Linux服务器部署

安装 Hugo

部署在服务器上,可以上传到服务器执行打包,也可以打包完再上传服务器,都是一样的效果,我这边选择在服务器打包,所以还需要安装一次。对于linux,不同系统版本和依赖不同,安装方式也不同,这边只给出使用Go自己编译的方式。

1
2
3
4
#国内go镜像
export GOPROXY=https://goproxy.cn,direct
#编译
CGO_ENABLED=1 go install -tags extended github.com/gohugoio/hugo@latest

编译好之后位于

创建 Git 裸仓库

1
2
3
mkdir -p /var/repo/hugo-blog.git
cd /var/repo/hugo-blog.git
git init --bare

创建部署目录

1
2
mkdir -p /var/www/hugo-blog-src  # 源代码
mkdir -p /var/www/hugo-blog      # 静态站点目录

配置 Git Hook

进入裸仓库 hooks:

1
2
cd /var/repo/hugo-blog.git/hooks
vi post-receive

写入:

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
#!/bin/bash
WORK_TREE=/var/www/hugo-blog-src #源码目录
DEPLOY_DIR=/var/www/hugo-blog 	#静态网站目录
REPO_DIR=/var/repo/hugo-blog.git	#仓库目录

#检出最新 commit 到工作区
git --git-dir=$REPO_DIR --work-tree=$WORK_TREE checkout -f main

#清理旧的静态输出
rm -rf $DEPLOY_DIR/*

#Hugo打包
cd $WORK_TREE
hugo --config hugo.yaml -d $DEPLOY_DIR --cleanDestinationDir

保存并加执行权限:

1
chmod +x post-receive

推送到服务器

添加远程仓库

在本地项目目录执行:

1
git remote add origin ssh://user@your-server-ip:/var/repo/hugo-blog

生成ssh并上传服务器

1
2
ssh-keygen -t ed25519 -C "your_email@example.com"
ssh-copy-id user@your-server-ip

第一次推送

1
2
3
git add .
git commit -m "Initial commit"
git push -u origin main

以后只需要:

1
git push

配置静态资源代理

编辑 /etc/nginx/sites-available/blog.conf

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
server {
    listen 80;
    server_name 域名;

    root /var/www/hugo-blog;   # 静态文件目录
    index index.html index.htm;

    location / {
        try_files $uri $uri/ =404;
    }
}

启用并重启:

1
2
3
ln -s /etc/nginx/sites-available/blog.conf /etc/nginx/sites-enabled/
nginx -t
sudo systemctl restart nginx
使用 Hugo 构建
主题 StackJimmy 设计