网站的构建技术笔记

好的，以下是完整的部署流程总结：

1. 方案概述

组件	用途
Cloudflare Pages	静态网站托管（全球 CDN、免费无限带宽）
Hugo	静态网站生成器（Markdown → HTML）
Wrangler	Cloudflare CLI 工具（本地部署）

工作流：本地写 Markdown → Hugo 构建 → Wrangler 部署 → 上线

2. 安装 Hugo

# Ubuntu/WSL - 安装最新版
wget https://github.com/gohugoio/hugo/releases/download/v0.124.1/hugo_extended_0.124.1_linux-amd64.deb
sudo dpkg -i hugo_extended_0.124.1_linux-amd64.deb

# 验证
hugo version

3. 安装 Wrangler

npm install -g wrangler

# 验证
wrangler --version

4. 配置 hugo.toml

baseURL = 'https://你的项目名.pages.dev/'
languageCode = 'zh-CN'
title = '我的博客'
theme = 'PaperMod'

[params]
  mainSections = ["posts"]
  author = "你的名字"
  description = "博客描述"

[menu]
  [[menu.main]]
    name = "首页"
    url = "/"
    weight = 10
  [[menu.main]]
    name = "文章"
    url = "/posts/"
    weight = 20

5. 获取 API Token

访问 https://dash.cloudflare.com/profile/api-tokens
Create Token → Custom token
权限设置：

权限	设置
Account	Cloudflare Pages
User	User Details
Account	Memberships

复制 Token

6. 验证 Token

export CLOUDFLARE_API_TOKEN=你的Token
wrangler whoami

成功显示账户信息即有效。

7. 安装主题

# 进入博客目录
cd 你的博客目录

# 添加 PaperMod 主题
git init
git submodule add --depth=1 https://github.com/adityatelange/hugo-PaperMod.git themes/PaperMod

# 启用主题（已在 hugo.toml 中设置 theme = 'PaperMod'）

8. 更新文章

创建新文章

hugo new content/posts/文章名.md

文章模板格式

---
title: "文章标题"
date: 2026-03-25T00:21:00+08:00
draft: false
tags: ["标签1", "标签2"]
categories: ["分类"]
description: "文章摘要"
---

正文内容，支持 **Markdown** 语法。

## 二级标题

- 列表项
- 列表项

![图片描述](images/photo.jpg)

本地预览

hugo server -D
# 访问 http://localhost:1313

部署

hugo && wrangler pages deploy public --project-name=你的项目名

9. 便捷写作模板

创建 archetypes/default.md（新建文章自动套用）：

---
title: "{{ replace .Name "-" " " | title }}"
date: {{ .Date }}
draft: true
tags: []
categories: []
description: ""
---

## 引言

<!-- 简介 -->

## 正文

<!-- 主要内容 -->

## 总结

<!-- 结论 -->

---

**参考链接**
-

10. 完整工作流总结

步骤	命令/操作
新建文章	`hugo new content/posts/xxx.md`
本地编辑	用 VS Code/Typora/Obsidian
本地预览	`hugo server`
构建	`hugo`
部署	`wrangler pages deploy public --project-name=xxx`

Windows 一键脚本（deploy.bat）：

@echo off
hugo && wrangler pages deploy public --project-name=xxx