aws-amplify - gatsby 图像在 aws amplify 中托管时不显示，但在本地开发/netlify/gatsby 云上正常

Question

测试

我正在通过启动程序“Gatsby Default Starter”试用 gatsby

gatsby new test

在没有进行任何定制的情况下，我在本地主机上对其进行了测试，图像显示正常。

2021-06-22 更新 - 删除所有链接，在 reddit 中添加屏幕截图。

问题

但如您所见，只有 aws amplify 上的图像丢失，而 netlify 和 gatsby cloud 上的图像看起来还不错，并且与我的本地开发测试保持一致。

有人知道为什么吗？我应该如何继续让它在 aws amplify 上显示？我确实更喜欢 aws amplify 的仪表板，我的测试是针对即将进行的项目。

Answer 1

我遇到了同样的问题，在寻求解决它的过程中偶然发现了这个问题。但是，根据此处提供的信息或原始发布者的 Reddit 链接，我无法解决问题。我需要做更多的研究，现在发布这个答案以提供更多的背景和清晰度。我的应用程序是使用 Gatsby 版本 4 创建的，并使用 AWS Amplify 部署。

在 AWS Amplify 控制台中，选择您正在使用的应用程序，然后在“应用程序设置”下单击“重写和重定向”。然后在“重写和重定向”中单击“编辑”按钮并将您需要的文件类型添加到默认情况下应存在的 200(重写)规则的正则表达式中。

楼主似乎通过在正则表达式中添加“avif”解决了这个问题。然而，Gatsby 生成“webp”图像，这是我必须添加的文件扩展名才能完成这项工作。下面是一个屏幕截图。希望这对以后遇到此问题的其他人有所帮助。