我生成了一个带有图标的 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 not correct - typo in the Manifest?) x.firebaseapp.com/:1 App banner not shown: 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
}
最佳答案
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
关于google-chrome - 简单地替换渐进式 Web 应用程序的图标会导致 list 中出现错误，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/39198644/