原文链接: 使用 Obsidian 免费建个人博客，最终的网站样子可以看看原文。

目前我的网站发布流程就是使用该篇文章技术，如果你使用的 Notion 写文章，可以看看这篇 Vercel + Notion 建个人博客 。

相关工具

1. Obsidian + Github Publisher 插件
2. Hugo + Paper Mod 主题
3. Github
4. Vercel

具体步骤继续往下看。

Hugo + PaperMod

使用 hugo 初始化一个网站，并配置好你喜欢的主题，并发布到 Github 上，这块具体怎么弄就不展开介绍了。

可以参考：

• 官方主题文档：PaperMod
• 我的仓库：miaogaolin/workspace-obsidian-publisher 稍微改了点官方主题

Github Publisher

给 Obsidian 安装 Github Publisher 插件，该插件的作用是将 Obsidian 中的文章上传到 Github 仓库，上传前可以指定文件目录、自定义内容替换等操作。

我会根据使用过程，讲一讲我用到的配置，如果你对其它配置感兴趣，可以看看 官网文档。

Github config

注意：生成的 token 不要放在 Github 的公共仓库，检测到 token 就会失效。

Upload config

Text & link converters

这块配置影响上传文章后的内容结构。
 

注意：Markdown hard line break 最好关闭，我这边开启造成了空行变多，使代码难看、表格无法渲染。

下来稍微麻烦点展开说说，正则内容替换：

截图中有三个正则替换规则，每行后面都有个箭头，↑箭头表示插件应用之前替换，↓箭头表示插件应用之后替换。

正则内容：

• 第一行：图片路径，/(\(|\[)([0-9a-z]+)\.(png|jpg|webp)/ -> $1/images/$2.$3 ，将数字字母组合的图片名之前加上 /images 地址前缀，我图片在本地存储的，而且图片名称自动会存储为纯字母数字的格式，如果你有图床那这个就不需要这个配置。
• 第二行：文章之前引用，/[^\(]+\.md/ -> {{< relref "$&" >*/}}，将 obsidian 文章之间的引用转化为 hugo 中的格式，在 obsidian 文章之间引用是没有 md 后缀的，因此执行该替换的时间是等文章使用插件转化后再执行，据此后面的箭头向下。
• 第三行：文章封面，/cover\.image/ -> cover:\n image, 将一级 key 转为二级，因为 obsidian 不支持多层级属性。

{{</* relref "例子.md" >}} 这个在 hugo 中表示获取“例子.md”文件的相对访问地址，例如：例子.md 文件的 frontmatter 的 slug 配置为 example-1，那生成的结果大概就是 /post/example-1，不配置 slug 那访问地址就是 /post/例子

Attachment & embed note config

会将图片中使用到的本地图片上传到 static/images 仓库目录下。

优化内容的相关插件

这些 Obsidian 插件对于发布网站不是必要的，但是对于优化内容格式还是很有必要的：

• Obsidian Linter 插件,我只用了在英文两边加空格的设置。
• Image Converter 转化图片格式，我统一转为 webp，并设置了图片分辨率大小。
• Unique attachments 用于将附件的文件名统一为 “字母 + 数字”的格式。
• Image Inserter 用于找图片，我用于设置文章封面，即设置 cover:
  image 属性。

我完整说说我在 obsidian 模板里配置的内容，用于发布文章时统一的设置。
我的配置是和 Hugo 强关联的，如果你用了其它工具，就根据自己的情况调整。

---
date: "{{date}}" # 创建时间，我这边生成的格式是 YYYY-MM-DDTHH:mm:ssZ
tags: 
	- 标签1
	- 标签2
title: "{{title}}"
slug: "{{time}}" # 自定义 URL 中文章的访问名称，默认用时间戳填充模板格式为X
share: false  # 配合 Github Publisher插件用的,true表示 obsidian 的文章可以发布
canonicalURL: "" # 之前文章在其他地方被发布的地址，避免搜索引擎重复，设置了该属性会优先展示 canonicalURL 执行的文章
keywords:   # 用于 SEO 优化，也可以不配置该内容默认会使用 tags 的内容
	- 关键字1
	- 关键字2
description: "" # 文章的描述 SEO 优化，为空时默认会截取文章前面的内容
series: "系列" # 系列文章
lastmod:  # 文章最后更新的时间
lang: "cn" # 默认不用写，配置文件会设置默认 cn 中文，en 英文等等
cover.image: "" # 文章封面图片地址
author: # 作者名称
---

发布

Obsidian 命令

当然插件的配置也支持菜单模式，配置前往：Plugin settings -> Menu。
先使用命令行发布，输入 active，然后选择 Github Publisher 即可，记着文章的 share 属性要开启，即 true。
 

右下角会提示上传的进度，如果完成了右上角有提示：
 

如果你想上传多个 share 为 true 的文章，使用的命令为：

• Refresh published and upload new notes 将所有 share 为 true 且新更新的文章发布
• Refresh all published notes 将所有 share 为 true 的文章都发布

Vercel 部署

接下来访问 vercel 官网，然后将上面对应的仓库部署上去即可，不用关心我下面的仓库名称。

1. Github

使用 Github 登录

2. 创建项目

3. Import & Deploy

导入 Github 上 fork 后的项目，import 后再点击 deploy，下来需要耐心等会。

4. 域名

完成后点击 Go to Dashboard > View Domains，再添加自己的域名。

添加完后，再解析自己的域名，我的域名在阿里云购买的，先复制上图中蓝色框的内容，这个是在 Vercel 站上给你分配的域名。这个域名访问时不方便，所以用自己的。

图解：

• 记录类型：CNAME
• 记录值：填写自己的

总结

重点学会了 Github Publisher 插件后，你可以用 Hexo 等其它工具管理你的内容，只要把你 Obsidian 对应的内容放置到仓库对应的地方即可。

Vercel 也不是必须的，你也可以使用 Github Page，只是我个人习惯而已。