Когда я начинаю загружать страницу, я вижу мой значок, но когда страница все загружает, мой значок исчезает, и браузер показывает значок по умолчанию.
Есть ли у вас какие-либо советы по устранению этой проблемы??
У меня не было проблем с другими браузерами, даже с Edge.
Я использовал https://realfavicongenerator.net/ для создания значков.
<link rel="apple-touch-icon" sizes="180x180" href="./assets/favicons/apple-touch-icon.png">
<link rel="icon" type="image/png" sizes="32x32" href="./assets/favicons/favicon-32x32.png">
<link rel="icon" type="image/png" sizes="194x194" href="./assets/favicons/favicon-194x194.png">
<link rel="icon" type="image/png" sizes="192x192" href="./assets/favicons/android-chrome-192x192.png">
<link rel="icon" type="image/png" sizes="16x16" href="./assets/favicons/favicon-16x16.png">
<link rel="manifest" href="./assets/favicons/site.webmanifest">
<link rel="mask-icon" href="./assets/favicons/safari-pinned-tab.svg" color="#000000">
<link rel="shortcut icon" href="./assets/favicons/favicon.ico">
<meta name="apple-mobile-web-app-title" content="***MY PROJECT***">
<meta name="application-name" content="***MY PROJECT***">
<meta name="msapplication-TileColor" content="#ffffff">
<meta name="msapplication-TileImage" content="/mstile-144x144.png">
<meta name="msapplication-config" content="./assets/favicons/browserconfig.xml">
<meta name="theme-color" content="#ffffff">
Iдобавил классический значок [favicon.ico] в корневую папку.
Это файл манифеста.
{
"name": "***MY PROJECT***",
"short_name": "***MY PROJECT***",
"icons": [
{
"src": "/android-chrome-36x36.png",
"sizes": "36x36",
"type": "image/png"
},
{
"src": "/android-chrome-48x48.png",
"sizes": "48x48",
"type": "image/png"
},
{
"src": "/android-chrome-72x72.png",
"sizes": "72x72",
"type": "image/png"
},
{
"src": "/android-chrome-96x96.png",
"sizes": "96x96",
"type": "image/png"
},
{
"src": "/android-chrome-144x144.png",
"sizes": "144x144",
"type": "image/png"
},
{
"src": "/android-chrome-192x192.png",
"sizes": "192x192",
"type": "image/png"
},
{
"src": "/android-chrome-256x256.png",
"sizes": "256x256",
"type": "image/png"
},
{
"src": "/android-chrome-384x384.png",
"sizes": "384x384",
"type": "image/png"
},
{
"src": "/android-chrome-512x512.png",
"sizes": "512x512",
"type": "image/png"
}
],
"theme_color": "#ffffff",
"background_color": "#ffffff"
}
Это browserconfig.xml
<?xml version="1.0" encoding="utf-8"?>
<browserconfig>
<msapplication>
<tile>
<square70x70logo src="/mstile-70x70.png"/>
<square150x150logo src="/mstile-150x150.png"/>
<square310x310logo src="/mstile-310x310.png"/>
<TileColor>#ffffff</TileColor>
</tile>
</msapplication>
</browserconfig>
Может быть, я сделал некоторые настройки неправильно во время генерации.
Спасибо, ребята.