随笔—自动化网站写作

1. 前言

一直以来,都是手动完成网站写作。虽然有一部分写成 job.sh 脚本【功能为:自动编译并上传 GitHub 】,并且用 Alfred 已经大幅度提升效率【还是需要在 Alfred 中输入命令行】,但是整个网站写作还没有实现自动化。

用 Keyboard Maestro 后,可以把整个网站写作流程全部实现自动化,用一个 快捷键 + 数字 实现自动化网站写作。

注意⚠️:本文实现的电脑💻系统为 macOS 。

2. 自动化步骤

快捷键 Option + Command + B ,调出面板,依次选择:

  • Blog 1 New 实现自动创建新的 markdown 文件📃
  • Blog 2 Server 实现自动搭建本地查看网站的预备
  • Blog 3 Broswer Safari 实现自动用 Safari 浏览器显示本地网站预览
  • Blog 4 Upload 实现自动编译并上传网站

注意⚠️:这里用1、2、3、4来标记,按下快捷键 Option + Command + B ,调出面板后,可以输入1、2、3、4选择对应功能执行。

2.1 自动创建新的 markdown 文件

  1. 新建一个 Macros,命名为 Blog 1 New

  2. 点击「New Trigger - Hot Key Trigger」,输入快捷键 Option + Command + B

  3. 点击「New Action」,进入 Categories 的「Execute」,选中「Execute Shell Script」,鼠标🖱️双击添加,加入以下命令行,并设置为 Ignore results

cd /Users/name/blog/
/opt/homebrew/bin/hugo new post/$(date +%Y%m%d).md
/Applications/Sublime\ Text.app/Contents/SharedSupport/bin/subl /Users/name/blog/content/post
/Applications/Sublime\ Text.app/Contents/SharedSupport/bin/subl /Users/name/blog/content/post/$(date +%Y%m%d).md
  1. 关闭「Actions」,即可

注意⚠️:

  • /Users/name/blog/ 为网站的完全路径
  • /opt/homebrew/bin/hugo 为 hugo 执行的完全路径,用 which hugowhere hugo查看
  • /Applications/Sublime\ Text.app/Contents/SharedSupport/bin/subl 为 Sublime Text 的完全路径
  • /Users/name/blog/content/post 为网站文章的 markdown 文件的存放路径
  • $(date +%Y%m%d).md 为年月日命名的 markdown 文件,比如:20231215.md
  • markdown 文件的默认信息设置,请参考前面的一篇文章: hugo新建文章的默认信息

2.2 自动搭建本地查看网站的预备

  1. 新建一个 Macros,命名为 Blog 2 Server

  2. 点击「New Trigger - Hot Key Trigger」,输入快捷键 Option + Command + B

  3. 点击「New Action」,进入 Categories 的「Execute」,选中「Execute Shell Script」,鼠标🖱️双击添加,加入以下命令行,并设置为 Ignore results

cd /Users/name/blog
/opt/homebrew/bin/hugo server
  1. 关闭「Actions」,即可

注意⚠️:

  • 预备命令 /opt/homebrew/bin/hugo server,只要运行一次,可在浏览器用 http://localhost:1313 查看。
  • 第二次或多次运行后,端口会变为其他数字,且不可见,没有什么用,且在后台耗费资源,不推荐第二次或多次运行。

2.3 自动在浏览器显示本地网站预览

  1. 新建一个 Macros,命名为 Blog 3 Server

  2. 点击「New Trigger - Hot Key Trigger」,输入快捷键 Option + Command + B

  3. 点击「New Action」,进入 Categories 的「Application Control」,选中「Activate a Specific Application」,鼠标🖱️双击添加,设置为 Safari

  4. 点击「New Action」,进入 Categories 的「Safari Control」,选中「New Safari Window」,鼠标🖱️双击添加,With URL 设置为 http://localhost:1313

  5. 关闭「Actions」,即可

2.4 自动编译并上传网站

  1. 新建一个 Macros,命名为 Blog 4 Upload

  2. 点击「New Trigger - Hot Key Trigger」,输入快捷键 Option + Command + B

  3. 点击「New Action」,进入 Categories 的「Execute」,选中「Execute Shell Script」,鼠标🖱️双击添加,加入以下命令行,并设置为 Ignore results

cd /Users/name/blog
sh /Users/name/blog/job.sh

job.sh 【功能为:自动编译并上传 GitHub 】的具体内容为:

#!/bin/bash
# 部署到 github pages 脚本
# 错误时终止脚本
set -e

# 删除打包文件夹
rm -rf public

# 打包。simple-style是主题
# if using a theme, replace with `hugo -t <YOURTHEME>`
/opt/homebrew/bin/hugo -t simple-style 

# 进入打包文件夹
cd public

# Add changes to git.
/opt/homebrew/bin/git init
/opt/homebrew/bin/git add -A

# Commit changes.
msg="building site `date`"
if [ $# -eq 1 ]
  then msg="$1"
fi
/opt/homebrew/bin/git commit -m "$msg"

# 推送到github
/opt/homebrew/bin/git remote add origin git@github.com:yourname/yourname.github.io.git
/opt/homebrew/bin/git branch -M main
/opt/homebrew/bin/git push origin main --force

# 回到原文件夹
cd ..

注意⚠️:

  • /opt/homebrew/bin/git 为 git 的完全路径,用 which gitwhere git 查看
  • yourname 为 github.io 的用户名
  1. 点击「New Action」,进入 Categories 的「Notifications」,选中「Display Text」,鼠标🖱️双击添加,添加内容为:已上传完成✅!🍺🍵☕️

  2. 关闭「Actions」,即可

3. 末了的话

只有想不到,没有做不到。

重复的操作,交给自动化工具🔧。

工具🔧是为内容服务,重要‼️的是内容💡。