1.1 克隆项目#

1
# 克隆官方模板
2
git clone https://github.com/saicaca/fuwari my-blog
3
cd my-blog

1.2 安装依赖#

1
# 推荐使用 pnpm
2
pnpm install
3

4
# 或使用 npm
5
# npm install
6

7
# 或使用 yarn
8
# yarn install

1.3 启动本地开发#

1
pnpm dev

2.1 项目结构调整#

• 文章内容：src/content/posts/
• 主题组件：src/components/
• 布局文件：src/layouts/
• 全局配置：src/config.ts
• Astro 配置：astro.config.mjs

2.2 关键配置修改（重要！）#

1
pnpm add @astrojs/cloudflare

1
import { defineConfig } from 'astro/config';
2
import cloudflare from '@astrojs/cloudflare';
3

4
export default defineConfig({
5
  output: 'server',
6
  adapter: cloudflare(),
7
});

2.3 构建测试#

1
pnpm build

3.1 创建 GitHub 仓库#

1. 登录 GitHub
2. 点击 “New repository”
3. 命名仓库（如：my-blog）
4. 选择公开或私有

3.2 推送代码#

1
# 初始化本地仓库
2
git init
3
git remote add origin git@github.com:your-username/my-blog.git
4

5
# 添加并提交代码
6
git add .
7
git commit -m "Initial commit with fuwari blog"
8

9
# 推送到 GitHub
10
=======
11
1. 在 GitHub 上创建新仓库（比如 `username/blog`）。
12
2. 本地关联并推送：
13

14
```bash
15
git init
16
git remote add origin git@github.com:username/blog.git
17
git add .
18
git commit -m "初始 fuwari 博客"
19
>>>>>>> 50db076 (Add Spark AI ChatBot integration with API support)
20
git branch -M main
21
git push -u origin main

4.1 Cloudflare Pages（推荐）#

<<<<<<< HEAD

4.2 环境变量配置说明#

5.1 添加域名#

1. 在 Cloudflare 仪表盘添加域名
2. 按照指引修改域名 DNS 服务器

5.2 配置 DNS 记录#

1. 进入 “DNS” 设置
2. 添加 CNAME 记录指向 Pages 生成的地址
3. 或直接使用 Pages 提供的域名

5.3 SSL/TLS 设置#

• SSL/TLS 模式：Full (严格)
• 自动 HTTPS 重写：开启
• ** Opportunistic Encryption**：开启 =======
• 在 Cloudflare 仪表盘添加域名 site.example.com。
• 为 Pages/Workers 生成的地址创建 CNAME 记录。
• 开启 SSL/TLS（通常自动由 Cloudflare 管理）。
• 启用必要的优化（缓存、页面规则、防火墙等）。

50db076 (Add Spark AI ChatBot integration with API support)

6.1 访问验证#

• 访问生成的 *.pages.dev 域名
• 或访问自定义域名
• 检查所有页面加载是否正常

6.2 自动部署设置#

• 每次向 main 分支推送代码
• Cloudflare Pages 会自动触发构建和部署
• 可在 “Settings” > “Builds” 中配置

6.3 功能验证#

• 检查文章显示是否正常
• 测试搜索功能
• 验证评论系统（如有）
• 检查多语言支持（如有）

7.1 性能优化#

• 启用 Brotli 压缩
• 配置缓存策略
• 使用 CDN 加速静态资源

7.2 安全设置#

• 启用 WAF（Web Application Firewall）
• 配置速率限制
• 启用 DDoS 保护

7.3 监控与分析#

• 配置 Google Analytics
• 使用 Cloudflare Analytics
• 设置部署通知（Slack、Email 等）

7.4 常见问题排查#

• 构建失败：检查 astro.config.mjs 配置
• 页面加载慢：优化图片和资源
• 功能异常：查看浏览器控制台错误
• 部署问题：检查 Cloudflare Pages 构建日志

8.1 内容更新#

• 在 src/content/posts/ 添加新文章
• 使用 Markdown 语法编写内容
• 提交并推送到 GitHub

8.2 主题定制#

• 修改 src/styles/ 中的 CSS
• 自定义组件在 src/components/
• 调整布局在 src/layouts/

8.3 依赖更新#

1
# 检查依赖更新
2
pnpm outdated
3

4
# 更新依赖
5
pnpm update