Create-react-app: Cannot install app to homescreen

Created on 7 Nov 2017  路  5Comments  路  Source: facebook/create-react-app

Since react-scripts 1.0.10 and with 1.0.17 I can't install the app on my desktop running windows 10 with npm version 5.0.3 , the latest chrome version, and everything up to date, it says "Site cannot be installed: a 144px square icon is required, but no supplied icon meets this requirement". I tried to add 144x144 in the size array in the manifest, tried to add a png icon with this size, I tried stack overflow to see some answers ,and I would like to know what to do to make it work as a standalone app on my phone or desktop ,

thanks in advance for your reply

question > PWA

Most helpful comment

Yep the same problem in Chrome if you try to add it to homescreen.

Try with this manifest.json and adding a icon.png to your public folder. That solves the problem for me in Chrome at least.

{
  "short_name": "React App",
  "name": "Create React App Sample",
  "icons": [
    {
      "src": "icon.png",
      "sizes": "144x144 64x64 32x32 24x24 16x16",
      "type": "image/png"
    }
  ],
  "start_url": "./index.html",
  "display": "standalone",
  "theme_color": "#000000",
  "background_color": "#ffffff"
}

All 5 comments

A project which reproduces this would be very appreciated.

@Timer fresh CRA created app no mods or anything, with production build

@Timer do you have any new information? I never got the chance to test the pwa feature

Yep the same problem in Chrome if you try to add it to homescreen.

Try with this manifest.json and adding a icon.png to your public folder. That solves the problem for me in Chrome at least.

{
  "short_name": "React App",
  "name": "Create React App Sample",
  "icons": [
    {
      "src": "icon.png",
      "sizes": "144x144 64x64 32x32 24x24 16x16",
      "type": "image/png"
    }
  ],
  "start_url": "./index.html",
  "display": "standalone",
  "theme_color": "#000000",
  "background_color": "#ffffff"
}

Closing as answered. Sorry I didn't give a better answer the first time, but this is a general service worker question and I didn't know desktop PWAs needed larger icons.

Was this page helpful?
0 / 5 - 0 ratings

Related issues

AlexeyRyashencev picture AlexeyRyashencev  路  3Comments

stopachka picture stopachka  路  3Comments

fson picture fson  路  3Comments

ap13p picture ap13p  路  3Comments

alleroux picture alleroux  路  3Comments