GitHub Pages部署后本地图片无法显示的问题咨询

完全可以使用上传到GitHub仓库里的本地图片，不需要替换成外部图床的链接，问题大概率出在图片路径设置或者仓库文件结构的细节上，按以下步骤排查解决：

1. 检查图片引用路径 #

• 绝对路径不能用本地路径：比如你本地写的C:/Users/xxx/Desktop/headshot.jpg这种本地绝对路径，服务器上根本不存在，必须改成相对路径。
• 路径要和仓库结构匹配：假设你的仓库结构是这样：

  ├── index.html
  └── images
      ├── banner.jpg
      └── profile.png
  

  那HTML里的正确引用应该是：

  <img src="images/banner.jpg" alt="Banner">
  

  如果HTML文件在pages子文件夹里，路径要回退一级：

  <img src="../images/banner.jpg" alt="Banner">
  

• 注意大小写：GitHub是区分大小写的，比如你本地写的Images/Banner.jpg，但仓库里是images/banner.jpg，就会出现404错误。

2. 确认图片已成功上传到部署分支 #

• 打开你的仓库，检查对应文件夹里的图片是否存在，有没有上传失败的情况。
• 确认GitHub Pages部署的分支（默认是main或gh-pages）里包含这些图片，别传错分支了。

3. 用开发者工具排查具体错误 #

打开部署后的网站，按F12打开浏览器开发者工具：

• 切换到「控制台（Console）」，查看是否有404报错，报错信息会显示找不到的图片路径，对照这个路径去仓库里核对文件位置。
• 切换到「网络（Network）」标签，刷新页面后看图片请求的状态，404就代表路径不对。

只要把这些细节调整正确，仓库里的本地图片就能正常显示在GitHub Pages上。

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