为什么使用 obsidian：Obsidian 有很多可用的插件，比如 excalidraw 这种流程图软件等等，可以一站实现所有的写文流程，不用再切换其他软件做图；
为什么使用 cloudflare pages：有现成的 Hugo 部署方案，结合 Github 可以实现自动化部署；
QuickAdd 有什么作用：可以使用快捷键将 posts 添加到想要的位置，并且添加 front matter 的 yaml 模版；
需要注意什么：obsidian vault 作为一个写作仓库，会生成.obsidian等与 hugo 部署无关的文件夹，需要添加在.gitignore中防止出现奇怪的问题。
流程涉及的 Obsidian 插件
1. QuickAdd
https://github.com/chhoumann/quickadd
- 快速在指定位置新建 posts/moments
- 使用指定模版
2.Update time on edit
https://github.com/beaussan/update-time-on-edit-obsidian
- 自动生成创建时间
- 自动更新编辑时间
- 自定义创建时间和编辑时间字段名称
3. Git
https://github.com/Vinzent03/obsidian-git
- 一键 Commit and push 到 github 仓库
- 可以设置自动推送（不建议）
前置要求
- 已经将 Hugo 项目部署至 Cloudflare PagesHugo · Cloudflare Pages docs或者 VercelHow to Deploy a Hugo Site with Vercel。
- 了解 Obisidian 的基本使用技巧。
流程实操
Step 1 - 创建 Posts 模版
包含常用参数的 frontmatter 模版，比如我在/_template中添加了 2 个模版文件，一个是显示在文章列表中的 posts 模版，一个是显示在瞬间列表中的 moments 模版，模版内容如下：
add_hugo_posts.md
---
title: {{name}}
slug:
date:
lastmod:
tags:
categories:
series:
summary:
draft: false
---
add_hugo_moments.md
---
date:
lastmod:
slug: {{date:yyyy-MM-dd'T'HH:mm:ss}}
tags:
---
Step 2 - 新建 QuickAdd 模版
- 添加模版文件路径：obsidian 仓库内的绝对路径
- 输入 QuickAdd 的名称
- 添加至列表
- 设置 QuickAdd 选项
配置说明：我使用的 Hugo 模版是PaperMod，文章内容结构是这样的：
├── content/
│ ├── posts/
| ├── post1/
| ├── index.md
| ├── pic1.png
| ├── pic2.jpg
|
| ...
|
| ├── post2/
| ├── index.md
| ├── _index.md
所以配置如上图：
- Create in folder: content/posts
- File Name: {{name}}/index
在这样的配置下，使用名为 add post 的 quickadd，将创建一个content/posts/{{name}}/index.md，其中{{name}}为使用 quickadd 时输入的文件名。
如果你的文章结构是下面这种，那么将 File Name 改成{{name}}即可，这样将创建一个content/posts/{{name}}.md。
├── content/
│ ├── posts/
| ├── post1.md
|
| ...
|
| ├── post2.md
| ├── _index.md
Step 3 - 设置 QuickAdd 快捷键
添加 Run QuickAdd 的快捷键。
Step 4 - 配置 Update time on edit
根据站点实际要求更改日期格式和时间以及编辑时间字段名称，比如我的站点：
- Date format：yyyy-MM-dd’T’HH:mm:ss。使用详细的时间数据方便后续站点设置中的截取。
- Front matter updated name：lastmod。详见
layouts/partials/post_meta.html配置。 - Front matter created name：date。详见
layouts/partials/post_meta.html配置。
layouts/partials/post_meta.html
{{- $scratch := newScratch }}
{{- /* 显示发布日期 */ -}}
{{- if not .Date.IsZero -}}
{{- $formattedDate := .Date.Format (default "2006-01-02 15:04" site.Params.DateFormat) }}
{{- $scratch.Add "meta" (slice (printf "<span title='%s'>%s</span>" .Date $formattedDate)) }}
{{- end }}
{{- /* 检查 Lastmod 和 Date 是否相差至少一天 */ -}}
{{- if gt .Lastmod .Date -}}
{{- $lastUnix := .Lastmod.Unix }}
{{- $dateUnix := .Date.Unix }}
{{- $diffSeconds := sub $lastUnix $dateUnix }}
{{- $diffDays := div $diffSeconds 86400 }}
{{- if ge $diffDays 1 }}
{{- $formattedLastmod := .Lastmod.Format (default "2006-01-02 15:04" site.Params.DateFormat) }}
{{- $scratch.Add "meta" (slice (printf "<span title='%s'>(更新于: %s)</span>" .Lastmod $formattedLastmod)) }}
{{- end }}
{{- end }}
{{- /* 显示阅读时间 */ -}}
{{- if .Param "ShowReadingTime" -}}
{{- $readTime := i18n "read_time" .ReadingTime | default (printf "%d min" .ReadingTime) }}
{{- $scratch.Add "meta" (slice $readTime) }}
{{- end }}
{{- /* 显示字数统计 */ -}}
{{- if .Param "ShowWordCount" -}}
{{- $wordCount := i18n "words" .WordCount | default (printf "%d words" .WordCount) }}
{{- $scratch.Add "meta" (slice $wordCount) }}
{{- end }}
{{- /* 显示作者信息 */ -}}
{{- if not (.Param "hideAuthor") -}}
{{- with (partial "author.html" .) }}
{{- $scratch.Add "meta" (slice .) }}
{{- end }}
{{- end }}
{{- /* 输出所有元信息，用 · 分隔，并包裹在左对齐的容器中 */ -}}
{{- with ($scratch.Get "meta") }}
<div class="meta-left-align">
{{- delimit . " · " | safeHTML -}}
</div>
{{- end }}
Step 5 - 新建 posts
修改相关的 frontmatter 信息。
Step 6（可选） - 使用盘古 PanGu 插件优化排版
在中英文之间增加空格以优化阅读体验。
Step 7 - 使用 Git 插件 Commit&Push 到 Github 仓库
Step 8 - 等待自动部署完成
然后就恭喜大功告成啦！！！