大概流程

本地仓库关联远程仓库为 coding(速度快),然后利用 coding的云构建自动同步到github中,然后 vercel 关联github中对应的仓库,为什么不直接用github,因为个人需要首先保证本地仓库能快速的同步到远程仓库,对网站的及时性要求不高, 所以同步使用的是国内仓库,网站使用的是 vercel

本地仓库默认使用dev分支,当想要更新网站时,手动将dev合并到master,此时将会触发 ci中的job,将代码同步到 github中对应的仓库的 master 分支,之后 vercel 将会自动部署更新网站

obsidian 所需插件

  1. obsidian-git(同步代码所用)
  2. quickadd(新增hugo文章模板所用)

QuickAdd 插件配置

在 obsidian 仓库根目录新建 _templates 文件夹并在其中新建 hugo.md 文件内容如下 我的环境$remote-branch仓库关联分支 为 dev分支

---
title: {{VALUE:title}}
slug: {{VALUE:slug}}
date: {{VALUE:date}}
draft: true
tags:
comments: true
ShowToc: true
dateUpdated: {{VALUE:dateUpdated}}
---

继续在 obsidian 仓库根目录新建 _scripts 文件夹并在其中新建 create_new_post.js 内容如下

module.exports = async (params) => {
  QuickAdd = params;

  const title = await QuickAdd.quickAddApi.inputPrompt("Title");

  QuickAdd.variables["title"] = title;
  QuickAdd.variables["date"] = QuickAdd.quickAddApi.date.now('YYYY-MM-DDTHH:mm:ssZ');
  QuickAdd.variables["slug"] = Math.random().toString(36).slice(-8)
  QuickAdd.variables["dateUpdated"] = QuickAdd.quickAddApi.date.now('YYYY-MM-DDTHH:mm:ssZ');
  console.log(QuickAdd.variables);
};

打开 QuickAdd 插件设置,添加一个 Choice, 选择 Macro

image.png

然后配置 刚刚新增的 Macro, 先添加 User Scripts 选择之前创建的 create_new_post.js 脚本,然后点击 Template 添加一个模板,打开模板配置,依次输入 Template Path File Name: title ,打开 Create in folder 选项输入content/posts

image.png

image.png

在 coding 中新增持续集成-构建计划

我的环境$remote-branch仓库关联分支 为 dev分支

  1. 由于 obsidian-git 软件会不断的提交代码到远程仓库中,所以要关闭代码源触发
  2. 添加定事触发规则,分支选择 $remote-branch, 每天指定时间触发(表示每天都会更新一次网站)
  3. 手动触发的默认构建目标选择 $remote-branch

示例图

粘贴图片自动上传图床

  1. Obsidian Image Auto Upload Plugin 插件 配合 picgo-core
  2. 安装 xclip
  3. npm i picgo -g 安装 picgo, picgo use 根据提示选择想要的配置, 然后 picgo set uploader 输入对应的信息
  4. 进入 obsidian ,插件Image Auto Upload Plugin 设置, PicGo-Core 如下图 设置, where picgo 获取 picgo的路径 然后路径后面加 u, 最终结果为 /run/user/1000/fnm_multishells/207583_1690882637858/bin/picgo u, 或者直接输入 export PATH=/home/ming/.fnm:$PATH && eval "$(fnm env --use-on-cd)" && picgo u

示例图2

示例图3