前置说明

比较喜欢大佬搭建的这个主题风格，完全仿照大佬教程搭建，大佬博客地址：https://www.sulvblog.cn/posts/blog/build_hugo

1. Hugo安装

Windows安装：

①.安装PowerShell：移步官方GitHub地址下载 ，直接下载.msi包进行安装，简单下一步即可完成安装

②.安装好PowerShell后，在PowerShell中执行winget install Hugo.Hugo.Extended以安装Hugo扩展版本

其他操作系统：

请参照Hugo的官方文档进行安装

2. 博客创建，启动

可参照大佬GitHub仓库说明：https://github.com/xyming108/sulv-hugo-papermod

① 用git clone的方式拉取代码至桌面，此时会在桌面生成sulv-hugo-papermod目录

git clone git@github.com:xyming108/sulv-hugo-papermod.git

② 进入到sulv-hugo-papermod目录，输入git submodule update –init，表示拉取themes/hugo-PaperMod/下的子模块，里面放的是官方主题

③ 把目录定位到sulv-hugo-papermod下，在终端输入hugo server -D，在浏览器输入：localhost:1313 即可看到现成的博客模板

3. 修改配置

页面上的图标和配置文件的对应关系，参照下图，可以根据自己的喜好进行调整 涉及到图片需保存至 static/img/ 目录下

image.png

我调整后的效果如下：

image.png

大家按各自需要进行调整即可！

4.静态页面部署至云服务器

① public页面上传至云服务器

image.png

image.png

② Nginx（docker）的部署与配置

为方便管理，采用docker-compose的方式部署，创建docker-compose.yml文件，文件内容如下：

# 在docker-compose.yml同级目录下执行 docker-compose up -d
# 如果自行调整了yaml文件的名称，则执行 docker-compose -f xxx.yml up -d
version: '3'
services:
  nginx:
    image: nginx:latest                 
    container_name: nginx               # 容器名为'nginx'
    restart: unless-stopped             # 指定容器退出后的重启策略为始终重启，但是不考虑在Docker守护进程启动时就已经停止了的容器
    volumes:                            # 数据卷挂载路径设置,将本机目录映射到容器目录
      - "./nginx/conf/nginx.conf:/etc/nginx/nginx.conf"  # nginx配置文件
      - "./nginx/conf/conf.d/default.conf:/etc/nginx/conf.d/default.conf"
      - "/root/docker/syncthing/data/blog/ldjx-hugo-papermod/public:/usr/share/nginx/html"  # Hugo public文件夹
      - "./nginx/log:/var/log/nginx"
    environment:                        # 设置环境变量,相当于docker run命令中的-e
      TZ: Asia/Shanghai
      LANG: en_US.UTF-8
    ports:                              # 映射端口
      - "80:80"

需要注意的是：部分同学可能会遇到 docker-compose up -d 和 docker compose up -d 的困惑，可以参照下面的图片。参考链接

image.png

Nginx配置：

只配置了HTTP，HTTPS就需要自行研究了

# 要配置的第一个地方，这里的用户要改成root，不然可能会没有权限
# 我是docker启动的，没有遇到权限问题
user nginx;

worker_processes auto;
error_log /var/log/nginx/error.log warn;
pid /var/run/nginx.pid;

events {
    worker_connections 1024;
}

http {
    log_format  main  '$remote_addr - $remote_user [$time_local] "$request" '
                      '$status $body_bytes_sent "$http_referer" '
                      '"$http_user_agent" "$http_x_forwarded_for"';

    access_log  /var/log/nginx/access.log  main;

    sendfile            on;
    tcp_nopush          on;
    tcp_nodelay         on;
    keepalive_timeout   65;
    types_hash_max_size 2048;

    include             /etc/nginx/mime.types;
    default_type        application/octet-stream;

    include /etc/nginx/conf.d/*.conf;

    # 配置http
    server {
        # 要配置的第二个地方，80访问端口
        listen       80 default_server;
        # listen       [::]:80 default_server;

        # 要配置的第三个地方，域名
        server_name www.ldjx7.cn;
        # rewrite ^(.*) https://$server_name$1 permanent; #自动从http跳转到https
        # 要配置的第四个地方，这里指向public文件夹
        # root /root/docker/syncthing/data/blog/ldjx-hugo-papermod/public;

        include /etc/nginx/default.d/*.conf;

        # 要配置的第五个地方
        location / {
            root /usr/share/nginx/html;
            index  index.html index.htm;
        }

        # 要配置的第六个地方
        error_page 404 /404.html;
        location = /40x.html {
            root   /usr/share/nginx/html;
        }

        error_page 500 502 503 504 /50x.html;
        location = /50x.html {
            root /usr/share/nginx/html;
        }
    }
}

配置完成后，记得放开云服务器对应的端口，大陆服务器的80端口和443端口需要备案才能使用，安全组即使放通也不顶用。