Манифест веб-приложения: загруженный файл был пуст или поврежден

Question

Я занимаюсь разработкой веб-приложения с реакцией и хочу добавить свой значок в качестве значка. Я могу нажать на главном экране своего iPhone (после нажатия «Добавить на главный экран в Safari»).Вы можете найти бета-версию здесь: https://konekto -5gtxy7fpu.now.sh /

Я часами гуглял и пробовал разные варианты, но не смог решить проблему.Таким образом, я ищу вашу поддержку.

Ниже приведен соответствующий фрагмент из файла index.html:

<link rel="manifest" href="%PUBLIC_URL%/manifest.json" />
<meta name="apple-mobile-web-app-capable" content="yes" />
<meta name="apple-mobile-web-app-title" content="Konekto" />

<link rel="apple-touch-icon" href="%PUBLIC_URL%/_icons/apple-icon.png" />
<link
  rel="apple-touch-icon"
  href="%PUBLIC_URL%/_icons/apple-icon-57x57.png"
  sizes="57x57"
/>
<link
  rel="apple-touch-icon"
  href="%PUBLIC_URL%/icons/apple-icon-60x60.png"
  sizes="60x60"
/>
<link
  rel="apple-touch-icon"
  href="%PUBLIC_URL%/icons/apple-icon-72x72.png"
  sizes="72x72"
/>
<link
  rel="apple-touch-icon"
  href="%PUBLIC_URL%/icons/apple-icon-76x76.png"
  sizes="76x76"
/>
<link
  rel="apple-touch-icon"
  href="%PUBLIC_URL%/icons/apple-icon-114x114.png"
  sizes="114x114"
/>
<link
  rel="apple-touch-icon"
  href="%PUBLIC_URL%/icons/apple-icon-120x120.png"
  sizes="120x120"
/>
<link
  rel="apple-touch-icon"
  href="%PUBLIC_URL%/icons/apple-icon-128x128.png"
  sizes="128x128"
/>
<link
  rel="apple-touch-icon"
  href="%PUBLIC_URL%/icons/apple-icon-144x144.png"
  sizes="144x144"
/>
<link
  rel="apple-touch-icon"
  href="%PUBLIC_URL%/icons/apple-icon-152x152.png"
  sizes="152x152"
/>
<link
  rel="apple-touch-icon"
  href="%PUBLIC_URL%/icons/apple-icon-180x180.png"
  sizes="180x180"
/>
<link
  rel="apple-touch-icon"
  href="%PUBLIC_URL%/icons/apple-icon-precomposed.png"
/>

<link
  rel="icon"
  type="image/png"
  sizes="32x32"
  href="%PUBLIC_URL%/favicon-32x32.png"
/>
<link
  rel="icon"
  type="image/png"
  sizes="16x16"
  href="%PUBLIC_URL%/favicon-16x16.png"
/>
<link rel="manifest" href="%PUBLIC_URL%/site.webmanifest" />
    <link
      rel="mask-icon"
      href="%PUBLIC_URL%/safari-pinned-tab.svg"
      color="#5bbad5"
/>

Файл Manifest.json выглядит следующим образом:

{
  "short_name": "Konekto",
  "name": "Konekto Emergency App",
  "icons": [
    {
      "src": "android-chrome-192x192.png",
  "sizes": "192x192",
  "type": "image/png"
    }
  ],
  "start_url": ".",
  "display": "standalone",
  "theme_color": "#ffffff",
  "background_color": "#ffffff"
}

Я настроил значки следующим образом: корневой каталог frontend_mpd / public / icons /

Таким образом, я ожидаю, что правильный значок будетотображается на начальном экране при добавлении его на домашний экран iPhone, но отображается только снимок экрана приложения, а в режиме разработчика Chrome -> Приложение -> Показывается следующее: «Загруженный значок был пуст или поврежден».

При локальном запуске отображается следующее: Локальный манифест приложения

Большое спасибо за помощь!