Tailwind明暗模式按钮图片在GitHub Pages无法加载求助

以下是针对GitHub Pages上SVG无法加载、本地正常的常见原因及解决办法：

• 路径引用不匹配
  本地Live Server运行时，项目根目录直接对应访问根路径，但GitHub Pages部署后，你的项目是在子路径/tailwind-dark-light-mode/下。如果代码里用了相对路径（比如./sun.svg），线上会解析成https://cristianolm.github.io/sun.svg，而正确地址应该是https://cristianolm.github.io/tailwind-dark-light-mode/sun.svg。
  解决：修改图片src为基于项目根目录的绝对路径，比如/tailwind-dark-light-mode/sun.svg，或者确保相对路径的层级对应项目实际结构。

• 文件名大小写不一致
  本地Windows系统对文件名大小写不敏感，但GitHub Pages运行在Linux环境，严格区分大小写。如果代码里引用的是sun.svg，但仓库里实际是Sun.svg（反之亦然），就会加载失败。
  解决：统一代码里的引用文件名和仓库里的实际文件名大小写，保持完全一致。

• SVG文件未提交到仓库
  可能你本地有这两个SVG文件，但没通过Git提交推送到远程仓库，导致GitHub Pages部署时没有这些资源。
  解决：打开仓库文件列表确认sun.svg和moon.svg是否存在，若缺失，执行git add sun.svg moon.svg，提交并推送到远程分支。

• GitHub Pages缓存残留
  部署完成后，GitHub Pages可能存在缓存，导致新上传的资源无法及时加载。
  解决：尝试强制刷新页面（Ctrl+F5），或者等待5-10分钟让缓存更新；也可以进入仓库的「Settings -> Pages」页面，重新触发一次部署。

内容的提问来源于stack exchange，提问作者Cristianolm