图片加载与Jekyll + GitHub页面不一致

Question

我最近创建了一个Jekyll/Github页面站点，希望能开一个小博客来分享想法和副业。在写完我的第一篇文章后，我意识到我在这篇文章中的一些但不是所有的图片都不起作用。我已经尝试了几个小时，试图找出原因，但都是徒劳。下面是我的资源/图像文件夹。以3、4和5为后缀的图像可以正确显示，但图像1和2不能。有没有可能Jekyll/Github只拍摄特定大小阈值的图像？

​

​

我相信我的_config.yml配置得很好。它至少能够找到图像3-5。

url : "https://selfawarelemon.github.io/evil-lemonade"

作为参考，这里是我如何引用博客帖子中的所有图像。同样，此逻辑适用于图像3-5，但不适用于图像1-2。

<img src="{{ site.url }}/assets/images/101820_1.png" width="250px">

每个标记中唯一的区别是我提供的宽度，以便使用width参数适当地调整图像大小。我不确定这里的问题是什么。此外，我还尝试在提交后等待一段时间，看看是否只需要时间来加载图像，但这不起作用。有没有什么非常明显的东西我遗漏了，或者仅仅是Jekyll/Github页面的一个属性，我不知道？

Answer 1

正如您在提供的图像中看到的，文件名是大写的：

101820_1.PNG
101820_2.PNG
101820_3.PNG
// ...

但是，在您的镜像标签中，文件名不是大写的：

<img src="{{ site.url }}/assets/images/101820_1.png" width="250px">

将文件名大写应该可以解决这个问题：

<img src="{{ site.url }}/assets/images/101820_1.PNG" width="250px">

根据标准，URL中的路径区分大小写。根据运行Github页面的操作系统，区分大小写的图像路径可能很重要，也可能不重要。这可能是导致渲染图像不一致的原因。

这个答案是由@shubhamjha在评论中提出的。我为将来有同样问题的访问者创建了这个小答案。

Answer 2

快速的解决方案是保持资产扩展名的大小写(大写/小写)不变，例如https://whoami-shubham.github.io/assets/img/earth.jpg和https://whoami-shubham.github.io/assets/img/earth.JPG会给出不同的结果。

在您的图像中，图像的路径扩展名是小写的png，但实际上是大写的PNG。所以把它改成大写就可以解决问题了。

<img src="{{ site.url }}/assets/images/101820_1.PNG" width="250px">

根据RFC 4343，域名不区分大小写。URL的其余部分可能区分大小写，也可能不区分大小写。例如

• https://stackoverflow.com/Tags
• https://stackoverflow.com/tags

上面两个URL给出了相同的结果似乎StackOverflow URL不区分大小写，然而，下面的GitHub页面URL是区分大小写的。

• https://whoami-shubham.github.io/hello-world

• https://whoami-shubham.github.io/Hello-world