起因
事情的起因是 UI 发了一套 png 图标。我把它们放到 next public 目录下，并嵌入到代码中。
<Image src="/logo.png" alt="Logo" width={180} height={32} priority />
我也尝试改成
<img />标签,问题依旧。
结果本地开发都没发现问题，直到发到线上，才发现报错
搜索了一大圈，都没能解决。一开始以为是 nginx 的问题。结果直接使用 IP 访问也有问题，那接下来就排查 nextjs 的配置问题
添加了如上配置依旧没能解决。
解决方案
我尝试使用 ip 地址直接访问 public 静态目录，一个一个测试所有 png 文件
- http://[ip地址]/logo.png
- http://[ip地址]/logo2.png
- http://[ip地址]/logo3.png
我发现，并不是所有 png 文件都不能显示，问题只出现在某几个png图标，刚好就是这次 UI 给的这一批。询问 UI 后得知导出配置并没有什么变化。
随后，我使用本地的图片编辑工具重新导出 png 格式，问题得到解决了！
总结
初步判断是 png 的压缩编码问题，nextjs 并不支持。奇怪的是本地预览软件都能正常打开，就 nextjs 显示不了。也希望知道具体原因的告知一下。
