博客操作指南

2026-03-10

本指南适用于 liubf.fun 博客系统的日常操作。

一、博客架构

1.1 技术栈

• 静态网站生成器: Astro
• 部署方式: 静态文件 + Nginx
• 服务器: 本机 (VM)
• 域名: liubf.fun

1.2 关键路径

二、写文章流程

2.1 创建新文章

在 ~/blog/src/content/blog/ 目录下创建 Markdown 文件：

touch ~/blog/src/content/blog/my-new-article.md

2.2 文章格式

文件头部需要包含 Frontmatter：

---
title: "文章标题"
date: "2026-03-10"
description: "文章描述（SEO 用）"
tags:
  - 标签1
  - 标签2
---

> 开场引言

## 一级标题

### 二级标题

正文内容...

2.3 本地预览

cd ~/blog
npm run dev
# 访问 http://localhost:4321

2.4 构建

cd ~/blog
npm run build

2.5 部署

# 复制静态文件到部署目录
sudo cp -r ~/blog/dist/* /home/ubuntu/message-board/html/message-board/build/

# 重载 Nginx
sudo nginx -s reload

三、日常操作

3.1 查看现有文章

ls -la ~/blog/src/content/blog/

3.2 编辑文章

# 用编辑器打开
vim ~/blog/src/content/blog/xxx.md
# 或者
nano ~/blog/src/content/blog/xxx.md

3.3 删除文章

# 1. 删除源文件
rm ~/blog/src/content/blog/xxx.md

# 2. 重新构建
cd ~/blog && npm run build

# 3. 重新部署
sudo cp -r ~/blog/dist/* /home/ubuntu/message-board/html/message-build/ && sudo nginx -s reload

3.4 部署命令（简化版）

# 一步完成构建+部署
cd ~/blog && npm run build && sudo cp -r dist/* /home/ubuntu/message-board/html/message-board/build/ && sudo nginx -s reload

四、常见问题

4.1 页面显示旧内容

原因: 浏览器缓存

解决:

• PC: Ctrl + Shift + R (强制刷新)
• 手机: 清除浏览器缓存

4.2 页面显示 404

原因: Nginx 未重载 或 文件未复制

解决:

sudo nginx -s reload

4.3 构建失败

原因: 可能是 Markdown 格式错误

解决:

• 检查 Frontmatter 格式
• 检查是否有未闭合的标签

4.4 大标题不显示

解决: 检查 ~/blog/src/pages/blog/[slug].astro 是否包含 <h1>{post.data.title}</h1>

五、部署流程图

┌─────────────────┐
│  写 Markdown   │
│ (本地编辑)      │
└────────┬────────┘
         │
         ▼
┌─────────────────┐
│  npm run build  │
│ (构建静态文件)   │
└────────┬────────┘
         │
         ▼
┌─────────────────┐
│  cp + nginx    │
│ (部署到服务器)  │
└────────┬────────┘
         │
         ▼
┌─────────────────┐
│  强制刷新页面   │
│ (Ctrl+Shift+R) │
└─────────────────┘

六、相关命令速查

最后更新: 2026-03-10