0001 环境准备

1. 番茄钟追踪

#1. 安装软件

#2. 本地配置Hugo

#3. 笔记预览

#4. 部署到Cloudflare

2. 软件安装

  1. 下载 Obsidian
  2. 下载 Hugo 直接下载带_extended的预编译包
  3. 下载 nvm-windows nvm install 24.10.0; nvm use 24.10.0;
  4. 在手机上安装番茄钟工具Forest

3. 创建项目

  1. 创建Obsidian仓库，如：my-digital-garden
  2. 初始化git仓库，将.obsidian添加到`.gitignore’中
  3. 创建Hugo site，命令：hugo new site my-digital-garden --force。注意在第一步的目录上级，让Hugo使用Obsidian的仓库路径
  4. 进入my-digital-garden，选择Hugo主题，命令：git submodule add https://git.codehub.cn.eu.org/amos/gohugo-theme-ananke.git themes/ananke
  5. 将theme = 'ananke'添加到hugo.toml文件
  6. 将以下配置添加到`.gitignore'
*.lock
public/
_gen/
  1. 创建文件夹content/posts、assets/images目录
  2. 配置Obsidian，如图：
  • 设置文件与链接：文件与链接设置
  • 设置模板：模板设置
  • 设置快捷键：快捷键设置
  1. 修改模板文件archetypes/default.md
+++
date = '{{date}}T{{time}}+08:00'
draft = true
title = '{{title}}'
+++
  1. 追加路径映射配置到hugo配置文件hugo.toml。这样obsidian和hugo中图像的路径就统一了，如果想在vscode的markdown预览器中正确显示图片，需要图像链接以/开头，即：![](/assets/images/someimage.png)
[module]
  [[module.mounts]]
    source = "assets/images"
    target = "static/assets/images"
  1. 新建笔记，修改标题，使用快捷键插入模板，写入内容
  2. 在Hugo中预览，在命令行执行：Hugo server -D

4. 部署到Cloudflare

  1. 在项目根目录运行命令：
# 本地安装，Cloudflare推荐方式
npm i -D wrangler@latest
npx wrangler -v
  1. 创建账户API令牌，在Cloudflare Dashboard展开管理账户，选择账户API令牌，点击创建令牌，选择自定义令牌，指定令牌名称，权限下选择账户、Cloudflare Pages和编辑，点击继续以显示摘要，点击创建令牌。创建账户API令牌
  2. 获取项目账号ID，点击已托管域名，翻滚到最下，在右侧即可找到账户ID
  3. 使用Gitea Actions，转到Gitea用户设置，在Actions下找到密钥，添加CLOUDFLARE_ACCOUNT_ID，值为账号ID，添加CLOUDFLARE_API_TOKEN，值为账户API令牌。注意这两个名称是Wrangler默认支持的，参见System environment variables · Cloudflare Workers docs
  4. 创建Pages项目，在Cloudflare Dashboard展开计算（Workers），选择Workers和Pages，选择创建应用程序，选择Pages，选择拖拽文件，点击开始使用，输入项目名称，点击创建项目
  5. 返回Workers和Pages，选择刚才创建的项目，选择自定义域标签页，设置自定义域，输入域名，继续，激活域。之后即可通过自定义域名访问
  6. 创建Workflow，在项目根目录创建.gitea/workflows/pages-deployment.yaml，内容如下：
name: Cloudflare Pages Deployment Action
run-name: Deploy by ${{ gitea.actor }}

on: [push]

jobs:
  deploy:
    runs-on: [win_x64]
    permissions:
      contents: read
      deployments: write
    name: Deploy to Cloudflare Pages
    steps:
      - name: Checkout
        uses: https://gitea.com/actions/checkout@v4
        with:
          submodules: recursive
          token: ${{ secrets.YOUR_TOKEN }} # Replace YOUR_TOKEN
  
      - name: Build
        run: npm install && hugo

      - name: Deploy
        env:
          CLOUDFLARE_ACCOUNT_ID: ${{ secrets.CLOUDFLARE_ACCOUNT_ID }}
          CLOUDFLARE_API_TOKEN: ${{ secrets.CLOUDFLARE_API_TOKEN }}        
        run: npx wrangler pages deploy public --project-name=<PROJECT NAME> # Replace PROJECT NAME
read more