TIM'S BLOG

TIM'S BLOG

Hexo 博客搭建

52
2023-01-01

前言

最近突然又想写博客了,仔细一想这已经是第三次建博客了......

第一次用的 Jekyll,静态托管在 GitHub Pages 上。但是国内访问经常抽风,没用多久就删掉了...

第二次用的 Hexo,利用 GitHub Actions 自动构建 Docker 镜像,部署在阿里云上。但是当时没有自建图床,想放图片非常不方便,又没用多久就删掉了...

偶然发现了阿里云 OSS 自建图床的方案,配合 Typora + PicGo 自动上传,可以极其方便的编写 Markdown 并自动将图片上传到图床,然后再配合 Hexo 生成静态页面,整个流程非常的方便快速。

初始化博客

安装运行环境

参考官方文档,首先需要安装 GitNode.js 环境,所有环境安装完成后,使用 npm 安装 Hexo

这里使用的是全局安装,方便全局使用 hexo 命令。

$ npm install -g hexo-cli

初始化文件夹

参考官方文档初始化文件夹。

$ hexo init <folder>

安装博客主题

此时 package.json 文件中包含 "hexo-theme-landscape": "^0.0.3" 默认主题。由于不使用该主题,删除该行。

这里使用了 Fluid 主题,参考官方文档完成主题的安装。

$ npm install --save hexo-theme-fluid

然后在博客目录下创建 _config.fluid.yml,将主题配置文件默认模板的内容复制过去。

配置博客

参考 Hexo 官方文档Fluid 官方文档配置 _config.yml_config.fluid.yml 文件。

在博客的配置过程中,可以使用 hexo server 命令启动博客进行调试。

配置服务器

由于 GitHub Pages 国内访问经常抽风,这里将博客部署到阿里云轻量应用服务器上。

创建 DNS 解析记录

根据实际情况配置,正常只需要配置一条指向服务器的 A 记录即可,这里是为了实现后面的重定向。

主机记录

记录类型

记录值

blog

CNAME

aliyun.t1m2h0u.com

www

CNAME

blog.t1m2h0u.com

@

CNAME

www.t1m2h0u.com

创建 Web 服务器

由于是静态页面,需要一个 Web 服务器,这里使用 Caddy,配置简单且可以自动申请 HTTPS 证书。

Docker Compose 配置文件

version: "3"
​
services:
  caddy:
    image: caddy
    container_name: caddy
    restart: unless-stopped
    ports:
      - 80:80/tcp
      - 443:443/tcp
    volumes:
      - ./caddy/config:/config
      - ./caddy/data:/data
      - ./caddy/site:/site
      - ./caddy/Caddyfile:/etc/caddy/Caddyfile

配置 Web 服务器

这里需要使用 Web 服务器实现以下功能:

Caddy 配置文件

t1m2h0u.com {
    redir   https://www.t1m2h0u.com
}
​
www.t1m2h0u.com {
    redir   https://blog.t1m2h0u.com
}
​
blog.t1m2h0u.com {
    root    *   /site
    encode  gzip
    file_server
    handle_errors {
        rewrite     *   /{err.status_code}.html
        file_server
    }
}

启动 Web 服务器

$ docker-compose up -d

后续只需要将静态页面生成到 caddy/site 文件夹下即可。

发布博客

配置一键部署

参考官方文档安装 hexo-deployer-sftp

$ npm install hexo-deployer-sftp --save

修改 _config.yml 配置文件,添加 SFTP 部署方式。

deploy:
  type: sftp
  host: <host>
  user: <user>
  pass: <password>
  remotePath: [remote path]
  port: [port]
  privateKey: [path/to/privateKey]
  passphrase: [passphrase]
  agent: [path/to/agent/socket]

参数

描述

默认值

host

远程主机的地址

user

使用者名称

pass

密码

remotePath

远程主机的根目录

/

port

端口

22

privateKey

ssh私钥的目录地址

passphrase

(可省略)ssh私钥的密码短语

agent

ssh套接字的目录地址

$SSH_AUTH_SOCK

编写博客原文

source/_posts 文件夹下创建 Markdown 格式的博客原文,头部可以带以下元数据。

---
title: 标题
date: 2023-01-01 12:00:00
categories: [分类, 子分类]
tags: [标签1, 标签2, 标签3]
---

部署博客

生成静态文件并使用 SFTP 上传到前面配置的服务器上。

$ hexo deploy -g

后记

到此博客就部署完成了,后续只需要重复编写博客原文部署博客步骤即可完成博客静态页面的发布,Hexo 原始文件可以使用 GitHub 进行备份,整个流程非常的方便快速。

  • 0