漸進式網站應用程序網站無法安裝：沒有圖標可用於顯示

我正在構建一個漸進式網絡應用程序。我從create-react-app的樣板開始。然後我添加了一個Web應用程序清單。漸進式網站應用程序網站無法安裝：沒有圖標可用於顯示

應用程序/公/ manifest.json的

{ 
    "short_name": "First Contributions", 
    "name": "First Contributions", 
    "icons": [ 
     { 
      "src": "/android-chrome-192x192.png", 
      "sizes": "192x192", 
      "type": "image/png" 
     }, 
     { 
      "src": "/android-chrome-256x256.png", 
      "sizes": "256x256", 
      "type": "image/png" 
     } 
    ], 
    "theme_color": "#ffffff", 
    "background_color": "#ffffff", 
    "display": "standalone", 
    "start_url": "index.html" 
}

鏈接這index.html

應用程序/公/ index.html的

<!doctype html> 
<html lang="en"> 
    <head> 
    <meta charset="utf-8"> 
    <meta name="viewport" content="width=device-width, initial-scale=1"> 
    <link rel="shortcut icon" href="%PUBLIC_URL%/favicon.ico"> 
    <link rel="manifest" href="%PUBLIC_URL%/manifest.json"> 
    <title>First Contributions</title> 
    </head> 
    <body> 
    <div id="root"></div> 
     <script> 
     if ('serviceWorker' in navigator) { 
      navigator.serviceWorker.register('service-worker.js').catch(function(ex) { 
      console.warn(ex); 
      console.warn('(This warning can be safely ignored outside of the production build.)'); 
      }); 
     } 
     </script> 
    </body> 
    </html>

我已經使用realfavicongenerator.net生成圖標並將它們放在公共目錄中。

我使用gh-pages部署我的應用程序。當我嘗試Add to homescreen，我收到以下錯誤

Android的鉻192x192.png：1 GET https://roshanjossey.github.io/android-chrome-192x192.png 404（未找到）

錯誤，同時嘗試使用下面的圖標從清單：https://roshanjossey.github.io/android-chrome-192x192.png（下載錯誤或資源是不是有效的圖像）無法安裝

網站：沒有可用的圖標來顯示

我想我在圖標的webmanifest中做錯了什麼。

來源

2017-04-09 sudo bangbang