我的 Jekyll 博客发布流程

晚上在Gmini的指导下，完成了在obsidian下编辑再远程到github仓库的设置。

日常本地编辑和发布博客文章的流程

前提：

• 已经在本地电脑的 MyJekyllBlog 文件夹（位于 iCloud Drive 中）配置好了 Jekyll 环境和 Git 仓库。
• Obsidian Vault 设置为使用这个 MyJekyllBlog 文件夹。
• 之前已经成功 git push 过，并且 macOS 的钥匙串应该已经保存了 GitHub Personal Access Token (PAT) 以用于 HTTPS 认证。

---

步骤 1：在 Obsidian 中写作或修改内容

1. 打开 Obsidian，进入你的 MyJekyllBlog Vault。
2. 创建新文章：
   • 在 _posts 文件夹下，按照 YYYY-MM-DD-你的英文或拼音标题.md 格式创建新的 Markdown 文件。
   • 编写 Front Matter 和文章内容。
3. 修改现有文章：
   • 直接打开 _posts 文件夹中对应的 Markdown 文件进行编辑。
4. 添加图片（如果需要）：
   • 将图片文件保存到你规划好的图片目录（例如 assets/img/你的文章相关子文件夹/）。
   • 在 Markdown 文章中使用相对站点根目录的路径引用图片 (例如 ![描述](/assets/img/子文件夹/图片名.png))。
5. 修改其他文件：
   • 如果需要，你也可以修改 _config.yml、布局文件 (_layouts/)、包含文件 (_includes/) 或 CSS (assets/css/ 或 _sass/) 等。

---

步骤 2：(强烈推荐) 在本地预览更改

1. 打开终端 (Terminal) 应用。

2. 导航到你的博客仓库目录： （这一步最好办法是把博客仓库目录直接拽到终端窗口，这样就直接导航到了仓库目录下了） Bash

    cd "/Users/kunmingli/Library/Mobile Documents/iCloud~md~obsidian/Documents/Ming/MyJekyllBlog"
   

   (如果你的终端已经在这个目录，可以跳过此步)

3. 启动 Jekyll 本地服务器：

   Bash

    bundle exec jekyll serve --livereload
   

   • --livereload 参数非常有用，它会在你保存文件修改后自动刷新浏览器中的预览页面。
4. 在浏览器中打开预览：
   • 打开你的网络浏览器（如 Safari, Chrome）。
   • 访问：http://127.0.0.1:4000/`
5. 检查效果： 仔细查看你的修改是否如预期显示，链接是否正确，图片是否加载等。

---

步骤 3：将更改提交到本地 Git 仓库

当你对本地预览的效果满意后：

1. 回到终端窗口。
2. 如果 Jekyll 本地服务器还在运行 (通常会持续输出日志)，按 Ctrl + C 来停止它。

3. 查看文件状态 (可选，但好习惯)：

   Bash

    git status
   

   这会显示哪些文件被修改了、哪些是新添加的、哪些被删除了。

4. 将所有更改添加到暂存区：

   Bash

    git add .
   

   • . 代表当前目录下的所有更改。如果你只想提交特定文件，可以写 git add 文件名1 文件名2。

5. 提交更改到本地仓库：

   Bash

    git commit -m "你的提交信息"
   

   • 你的提交信息 应该简明扼要地描述你这次做了什么修改，例如：
     • "Add new post: 我的精彩周末"
     • "Update config: Change site tagline"
     • "Fix typo in about page"
     • "Add images to XXX post"

---

步骤 4：将本地提交推送到 GitHub 远程仓库 (发布到线上)

1. 推送更改：

   Bash

    git push
   

   • 由于你之前已经设置好了本地 main 分支跟踪远程 origin/main 分支，并且钥匙串应该已经保存了你的 PAT，所以这个命令通常可以直接工作，不再需要你输入用户名和密码。
   • 如果万一它还是提示输入用户名和密码（比如 PAT 过期或钥匙串问题），就输入你的 GitHub 用户名和有效的 PAT。

---

步骤 5：等待 GitHub Actions 部署并验证线上效果

1. git push 成功后，GitHub Actions 会自动被触发。
2. 访问你 GitHub 仓库的 “Actions” 标签页，查看名为 “Build and Deploy” (或者你在 .github/workflows/pages-deploy.yml 中定义的名字) 的工作流的运行状态。
3. 等待该工作流成功完成（显示绿色勾 ✅）。
4. 访问你的线上博客网站 (例如 https://www.tqabc.com)，清除浏览器缓存（有时需要）并刷新页面，查看你的最新更改是否已经成功部署。

---

总结一下最常用的命令序列 (在 PC 端终端中，位于 MyJekyllBlog 目录下)：

1. (可选，预览时) bundle exec jekyll serve --livereload (完成后按 Ctrl+C 停止) git add . git commit -m “增加文章列表缩略图” git push

这就是你以后更新博客的主要流程了！熟练之后会非常顺畅。记住，清晰的提交信息对以后回顾修改历史很有帮助。

博客插图

当你写博客文章时 (在 MyJekyllBlog/_posts/ 下)：

• 当你需要插入图片时，不要直接拖拽或使用 Obsidian 的标准插入命令。
• 手动将图片文件复制或移动到你博客仓库的图片目录 (例如 MyJekyllBlog/assets/img/你的文章名/)。
• 然后，在你的博客文章 Markdown 文件中，手动输入正确的 Markdown 图片链接，指向这个博客仓库中的图片路径，例如 ![描述](/assets/img/你的文章名/图片.png)。

总结一下推荐的流程：

1. 设置 nano 为默认编辑器：git config --global core.editor nano
2. (如果需要) 中止上次未完成的合并：git merge --abort (先用 git status 确认)
3. 重新拉取：git pull origin main
4. 在 nano 中确认提交信息：Ctrl + O 保存, Enter 确认, Ctrl + X 退出。
5. 推送：git push origin main

这个方法应该能让您绕开 Vim 的操作难题，顺利完成合并和推送。请尝试一下！