1. 准备工作:开启 iCloud Drive 与备份目录定位
1.1 开启 iCloud Drive 基础设置
在 Mac 的系统偏好设置中,开启 iCloud Drive,并选中 Desktop 与 Documents 的同步,以确保你的练习文件能在 iCloud Drive 中形成云端副本。
通过该设置,你的 HTML/CSS 练习目录就可以直接保存在 iCloud Drive 的云端区域,从而实现跨设备访问与备份的基础条件。每天的备份将以云端目录为目标,确保历史版本可回溯。
1.2 备份目录的创建与权限
在 Finder 新建一个明确的备份根目录,例如 HTML_CSS_Backups,并将其放置在 iCloud Drive 下,以便后续脚本能稳定写入。
如果你偏好使用终端创建,请执行以下命令来确保目录存在且具有正确的权限:在终端执行 mkdir -p 与目录路径,并确保 shell 账户对该位置有写入权限。
#!/bin/bash
TARGET="$HOME/Library/Mobile Documents/com~apple~CloudDocs/HTML_CSS_Backups"
mkdir -p "$TARGET"
2. 准备 HTML 与 CSS 练习的工作目录
2.1 将练习放入可备份目录
将你的 HTML 与 CSS 练习统一放在一个工作目录,比如 Documents/HTML_CSS_Practice,并确保该目录也被 iCloud Drive 同步。
一致性管理:保持结构简单,避免将大体积的构建产物直接加入,减少每日备份的体积与时间。
2.2 与 iCloud Drive 的路径对齐
在备份脚本里,源目录指向你的练习工作目录,目标目录指向 iCloud Drive 的备份目录,确保两端路径一致且可访问。
#!/bin/bash
SOURCE="$HOME/Documents/HTML_CSS_Practice/"
DEST="$HOME/Library/Mobile Documents/com~apple~CloudDocs/HTML_CSS_Backups/"
3. 编写自动备份脚本
3.1 使用 rsync 实现每日备份
使用 rsync 可以实现增量备份,仅同步变更的文件,并保持历史结构,确保每天的备份都可靠且高效。
下面的脚本示例演示了把当天的练习备份到一个以日期命名的子目录中,若你更愿意简单地覆盖,也可以将目标改为固定目录。
#!/bin/bash
set -euo pipefail
SOURCE="$HOME/Documents/HTML_CSS_Practice/"
DATE=$(date +%Y%m%d)
DEST="$HOME/Library/Mobile Documents/com~apple~CloudDocs/HTML_CSS_Backups/$DATE"
mkdir -p "$DEST"
rsync -av --delete "$SOURCE" "$DEST"
要点:确保脚本有执行权限,并且 PATH 中包含 rsync;若遇到权限问题,请检查 iCloud Drive 的同步状态以及目标路径的可写权限。
3.2 备份排除与优化策略
在某些情况下,你可能需要排除如 node_modules、构建输出 或临时文件夹。你可以通过在 rsync 命令中加入 --exclude 选项实现:
rsync -av --delete --exclude='node_modules/' --exclude='dist/' "$SOURCE" "$DEST"4. 使用 launchd 设置每日定时任务
4.1 创建 LaunchAgent plist
在 Mac 上,LaunchAgents 提供了一个稳定的机制,用于每天在设定时间启动备份脚本,而无需一直运行后台程序。
下面的 plist 配置示例设定在每天凌晨 2:00 触发备份。请根据实际脚本路径替换其中的 backup_html_css.sh。
Label com.user.htmlcssbackup ProgramArguments /bin/bash /Users/youruser/scripts/backup_html_css.sh StartCalendarInterval Hour 2 Minute 0 StandardOutPath /Users/youruser/Logs/backup_html_css.log StandardErrorPath /Users/youruser/Logs/backup_html_css.err
将 plist 文件放置在 ~/Library/LaunchAgents/,然后执行以下命令加载并启用该任务:launchctl load -w 与 launchctl start(若有)。

# 放置 plist 的示例路径
cp com.user.htmlcssbackup.plist ~/Library/LaunchAgents/
launchctl load -w ~/Library/LaunchAgents/com.user.htmlcssbackup.plist
5. 维护与校验
5.1 验证与日志
为了确认每日备份确实执行,请检查日志文件 /Users/youruser/Logs/backup_html_css.log,以及检查 iCloud Drive 的 目标文件夹是否有新日期目录出现。
快速验证:使用 ls -la 查看目标目录的内容,确认当天的日期子目录已创建并包含文件。
ls -la "$HOME/Library/Mobile Documents/com~apple~CloudDocs/HTML_CSS_Backups/$(date +%Y%m%d)"5.2 故障排除要点
若看到备份没有到达 iCloud Drive,先确认网络连接、iCloud Drive 状态,以及脚本是否具备执行权限。权限不足时可用 chmod 调整。
# 查看权限
ls -ld "$HOME/Library/Mobile Documents/com~apple~CloudDocs/HTML_CSS_Backups"
# 如有需要,调整权限
chmod -R u+rwX "$HOME/Library/Mobile Documents/com~apple~CloudDocs/HTML_CSS_Backups"


