Created app has wrong favicon "sizes" value in the manifest file, which results in console error.
See original GitHub issueIs this a bug report?
Yes
Can you also reproduce the problem with npm 4.x?
Did not try. Doesn’t seem to be related to that.
Which terms did you search for in User Guide?
I didn’t.
Environment
node -v
: v8.7.0npm -v
: 5.5.1yarn --version
(if you use Yarn):npm ls react-scripts
(if you haven’t ejected):
Then, specify:
- Operating system:
macOS 10.13
- Browser and version (if relevant):
Chrome 61
Steps to Reproduce
- Go to the created app’s manifest file in public folder.
- The icons array has wrongly mentioned the favicon.ico size as 192x192 instead of 16x16 size of the included favicon file.
- Run the app. Go to Dev Tools’ Application section. Open Manifest.
- Click Add to homescreen. This results in console error:
Error while trying to use the following icon from the Manifest: http://localhost:3000/favicon.ico (Resource size is not correct - typo in the Manifest?) Site cannot be installed: icon downloaded from the manifest was empty or corrupted
Expected Behavior
Should have searched for 144x144
image, where it would fail if we fix the size now.
Actual Behavior
Console error.
Reproducible Demo
Issue Analytics
- State:
- Created 6 years ago
- Comments:7 (3 by maintainers)
Top Results From Across the Web
Error while trying to use the following icon from the Manifest
You have to check if value of sizes attribute in your manifest.json matches with the real image size in the icon file! If...
Read more >How to Add Custom Dynamic Favicons in React & Next.js
When we create a new Next.js application with Create Next App, we actually get a favicon by default. Browser tab showing Next.js default...
Read more ><application> | Android Developers
The declaration of the application. This element contains subelements that declare each of the application's components and has attributes ...
Read more >The 2022 Guide to FavIcons for Nearly Everyone and ...
A (mostly) complete list of all the known Favorite Icon Sizes ; 32×32, favicon-32.png, Standard for most desktop browsers ; 128×128, favicon-128.
Read more >Favicon Not Showing Up - How to Fix In Chrome ...
You need to ensure that your favicon's file path is correct. If you have your icon in the images folder, then make sure...
Read more >Top Related Medium Post
No results found
Top Related StackOverflow Question
No results found
Troubleshoot Live Code
Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start FreeTop Related Reddit Thread
No results found
Top Related Hackernoon Post
No results found
Top Related Tweet
No results found
Top Related Dev.to Post
No results found
Top Related Hashnode Post
No results found
Top GitHub Comments
Actually, #3287 has the CLA Signed label: https://github.com/facebookincubator/create-react-app/pull/3287#event-1294045001
PR should be ready to go.
The included
favicon.ico
file I found was 64x64 instead of 16x16, so I used that value in #3287.