一、配置 Jekyll 环境

第一步：安装 Ruby

brew install ruby

将 Ruby 放到 PATH 目录。

echo 'export PATH="/opt/homebrew/opt/ruby/bin:$PATH"' >> ~/.zshrc

将 Ruby 的 gem 放到 PATH 目录（类似于 Homebrew 的下载器，添加到 PATH）

echo 'export PATH="/opt/homebrew/lib/ruby/gems/3.4.0/bin:$PATH"' >> ~/.zshrc
source ~/.zshrc

由于 macOS 原本自带一个 Ruby，需要检查当前用的是哪个：

which ruby

检查 gem 是否添加到 PATH，避免调用时前面要写一大堆路径：

which gem

第二步：安装 Bundler 和 Jekyll

gem install bundler jekyll

检查 jekyll 路径与版本。

which jekyll

jekyll -v

二、搭建博客

第一步：创建 Jekyll 博客项目

jekyll new myblog

这会创建一个名为 myblog 的新目录，里面包含一套默认的博客模板。

第二步：进入博客目录并启动本地服务器

cd myblog
bundle install
bundle exec jekyll serve

看到类似输出就表明成功了，可以通过浏览器访问该地址，查看本地博客：

Server address: http://127.0.0.1:4000/
Server running... press ctrl-c to stop.

第三步：发布到 GitHub Pages

登录 GitHub 并新建一个仓库

  • 仓库名为 [yourUserName].github.io，例如我的就叫 hadashinoyoujo.github.io。注意，仓库名不是 hadashinoyoujo，那个只是显示在 GitHub Profile 里面的特殊仓库而已。
  • 设置为 Public。

初始化 git 并推送博客代码

由于原本的窗口正在运行本地博客服务器，需要另开窗口

cd ~/myblog
git init
git remote add origin https://github.com/hadashinoyoujo/hadashinoyoujo.github.io.git
git add .
git commit -m "Initial Jekyll Blog"
git branch -M main
git push -u origin main

推送成功几分钟后，就可以访问这个地址（若 404，等 1～3 分钟即可）：

https://hadashinoyoujo.github.io

里面显示的就是本地服务器创建的 myblog 文件夹的内容了。

Q&A

1. 本地博客服务器需要一直开着吗？

不需要让本地的博客服务器一直开着。

因为这是静态网页，生成一次并上传 GitHub 就可以了。

原理是 GitHub 会自动托管该博客（的副本），访问时并不会依赖本地博客服务器。

2. 既然这是静态网页，为什么终端运行 jekyll serve 生成网页后，会占用我的终端窗口呢？

因为这句命令实际要做下面两件事：

  1. 生成静态网页（build）
    • 把 Markdown 文件和配置生成 HTML 文件，输出到 _site/ 目录。
  2. 启动本地服务器 + 监听文件改动（serve + auto-regenerate）
    • 启动本地服务器，通常是 http://localhost:4000。
    • 持续监听文件变化，自动生成新的静态网页，这样方便立即预览。

3. 未来如何推送新的推文？

  1. 首先在命令窗口启动服务器，重新编译静态网页。

    cd myblog
bundle exec jekyll serve

  2. 推送

    cd ~/myblog         # 进入博客目录（如果已经在目录下，可以跳过）
git add .           # 添加所有更改
git commit -m "你的提交信息，比如：更新文章《XXX》"  # 提交更改
git push origin main  # 推送到 GitHub

（可选）使用快捷命令一键推送

在 ~/.zshrc 中新建一个别名，对应顺序执行的多个操作。

使用 exec Jekyll build 仅编译静态网页，不启用服务器。

alias blogpush='cd ~/myblog && bundle exec jekyll build && git add . && git commit -m "update" && git push origin main'