如何用 github 页面修复 manifest.json 404

Question

我正在使用 Create-React-App 开发渐进式 Web 应用程序，当我部署到 Github 页面时，我收到 android-chrome-[= 的 404 25=]。清单似乎是从 'myName.github.io/' 而不是 'myName.github.io/myProject/' 请求的。当我在文件路径中添加项目名称时，我的开发服务器上出现错误，提示图像不存在！所有其他图标都工作正常，问题似乎只出现在 192x192 png 上。如果有人遇到同样的问题，我将不胜感激，非常感谢！

这是网站的实时版本，有错误：https://brose55.github.io/robofriends/

这适用于使用 Create-React-App 制作并部署到 Github 页面的 PWA。我尝试更改文件路径但没有任何效果。

"icons": [
{
  "src": "favicon.ico",
  "sizes": "64x64 32x32 24x24 16x16",
  "type": "image/x-icon"
},
    {
        "src": "/android-chrome-192x192.png",
        "sizes": "192x192",
        "type": "image/png"
    },
    {
        "src": "/android-chrome-384x384.png",
        "sizes": "512x512",
        "type": "image/png"
    }
],

预期的请求来自...github.io/robofriends 但实际请求来自...github.io/

Answer 1

这是一个简单的语法错误。删除来源url前面的'/'。注意 'favicon.icon' 没有 '/'。
例如："src"："android-chrome-192x192.png"、

如何用 github 页面修复 manifest.json 404

How to fix manifest.json 404 with github pages

lighthouse

github-pages

create-react-app