google-chrome - 简单地替换渐进式 Web 应用程序的图标会导致 list 中出现错误

Question

我生成了一个带有图标的 list 文件，后来我决定用不同的图标更改图标文件夹(通过复制、粘贴和覆盖)，当我这样做时，当我单击“添加到主页”时，我在 chrome devtools 中收到以下错误应用程序选项卡中的屏幕:

Error while trying to use the following icon from the Manifest:https://x.firebaseapp.com/icons/icon-144x144.png (Resource size is notcorrect - typo in the Manifest?) x.firebaseapp.com/:1 App banner notshown: no icon available to display

但是，在 Chrome 移动设备上，图标已更新(使用“添加到主屏幕”进行确认)

{
  "name": "Duckr",
  "short_name": "Duckr",
  "theme_color": "#2196f3",
  "background_color": "#2196f3",
  "display": "standalone",
  "orientation": "portrait",
  "Scope": "/",
  "start_url": "/",
  "icons": [
    {
      "src": "icons/icon-72x72.png",
      "sizes": "72x72",
      "type": "image/png"
    },
    {
      "src": "icons/icon-96x96.png",
      "sizes": "96x96",
      "type": "image/png"
    },
    {
      "src": "icons/icon-128x128.png",
      "sizes": "128x128",
      "type": "image/png"
    },
    {
      "src": "icons/icon-144x144.png",
      "sizes": "144x144",
      "type": "image/png"
    },
    {
      "src": "icons/icon-152x152.png",
      "sizes": "152x152",
      "type": "image/png"
    },
    {
      "src": "icons/icon-192x192.png",
      "sizes": "192x192",
      "type": "image/png"
    },
    {
      "src": "icons/icon-384x384.png",
      "sizes": "384x384",
      "type": "image/png"
    },
    {
      "src": "icons/icon-512x512.png",
      "sizes": "512x512",
      "type": "image/png"
    }
  ],
  "splash_pages": null
}

Answer 1

icons/icon-144x144.png 图像宽度应为 144px，高度为 144px

You can check your manifest in your application tab in chrome inspect

https://developers.google.com/web/tools/chrome-devtools/progressive-web-apps#add-to-homescreen