Skip to content

Commit

Permalink
[React C#] Change web app manifest extension to “webmanifest” (#80)
Browse files Browse the repository at this point in the history
* Change web app manifest extension to “webmanifest”

* Update Web App Manifest comment

- Web apps can be installed on more devices than just Android. All relevant desktop and mobile operating systems are supported (depending on the browser). That’s why I propose to use “installed” instead of “added to the homescreen”, which is a mobile-only metaphor.
- The URL has changed.
  • Loading branch information
christianliebel authored Jan 13, 2023
1 parent 13e9a2d commit 83c2bdc
Show file tree
Hide file tree
Showing 3 changed files with 9 additions and 9 deletions.
12 changes: 6 additions & 6 deletions src/content/React-CSharp/ClientApp/README.md
Original file line number Diff line number Diff line change
Expand Up @@ -1704,13 +1704,13 @@ option in the `SWPrecacheWebpackPlugin` section of
### Progressive Web App Metadata
The default configuration includes a web app manifest located at
[`public/manifest.json`](public/manifest.json), that you can customize with
details specific to your web application.
[`public/manifest.webmanifest`](public/manifest.webmanifest), that you can
customize with details specific to your web application.
When a user adds a web app to their homescreen using Chrome or Firefox on
Android, the metadata in [`manifest.json`](public/manifest.json) determines what
icons, names, and branding colors to use when the web app is displayed.
[The Web App Manifest guide](https://developers.google.com/web/fundamentals/engage-and-retain/web-app-manifest/)
Android, the metadata in [`manifest.webmanifest`](public/manifest.webmanifest)
determines what icons, names, and branding colors to use when the web app is
displayed. [The Web App Manifest guide](https://developers.google.com/web/fundamentals/engage-and-retain/web-app-manifest/)
provides more context about what each field means, and how your customizations
will affect your users' experience.
Expand Down Expand Up @@ -1836,7 +1836,7 @@ service worker navigation routing can be configured or disabled by
and [`navigateFallbackWhitelist`](https://github.com/GoogleChrome/sw-precache#navigatefallbackwhitelist-arrayregexp)
options of the `SWPreachePlugin` [configuration](../config/webpack.config.prod.js).
When users install your app to the homescreen of their device the default configuration will make a shortcut to `/index.html`. This may not work for client-side routers which expect the app to be served from `/`. Edit the web app manifest at [`public/manifest.json`](public/manifest.json) and change `start_url` to match the required URL scheme, for example:
When users install your app to the homescreen of their device the default configuration will make a shortcut to `/index.html`. This may not work for client-side routers which expect the app to be served from `/`. Edit the web app manifest at [`public/manifest.webmanifest`](public/manifest.webmanifest) and change `start_url` to match the required URL scheme, for example:
```js
"start_url": ".",
Expand Down
6 changes: 3 additions & 3 deletions src/content/React-CSharp/ClientApp/public/index.html
Original file line number Diff line number Diff line change
Expand Up @@ -6,10 +6,10 @@
<meta name="theme-color" content="#000000">
<base href="%PUBLIC_URL%/" />
<!--
manifest.json provides metadata used when your web app is added to the
homescreen on Android. See https://developers.google.com/web/fundamentals/engage-and-retain/web-app-manifest/
manifest.webmanifest provides metadata used when your web app is
installed. See https://web.dev/add-manifest/
-->
<link rel="manifest" href="%PUBLIC_URL%/manifest.json">
<link rel="manifest" href="%PUBLIC_URL%/manifest.webmanifest">
<link rel="shortcut icon" href="%PUBLIC_URL%/favicon.ico">
<!--
Notice the use of %PUBLIC_URL% in the tags above.
Expand Down

0 comments on commit 83c2bdc

Please sign in to comment.