You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Copy file name to clipboardExpand all lines: README.md
+1Lines changed: 1 addition & 0 deletions
Original file line number
Diff line number
Diff line change
@@ -151,6 +151,7 @@ Please refer to the [User Guide](https://github.com/facebookincubator/create-rea
151
151
* Import CSS and image files directly from JavaScript.
152
152
* Autoprefixed CSS, so you don’t need `-webkit` or other prefixes.
153
153
* A `build` script to bundle JS, CSS, and images for production, with sourcemaps.
154
+
* An offline-first [service worker](https://developers.google.com/web/fundamentals/getting-started/primers/service-workers) and a [web app manifest](https://developers.google.com/web/fundamentals/engage-and-retain/web-app-manifest/), meeting all the [Progressive Web App](https://github.com/facebookincubator/create-react-app/blob/master/packages/react-scripts/template/README.md#making-a-progressive-web-app) criteria.
154
155
155
156
**The feature set is intentionally limited**. It doesn’t support advanced features such as server rendering or CSS modules. The tool is also **non-configurable** because it is hard to provide a cohesive experience and easy updates across a set of tools when the user can tweak anything.
Copy file name to clipboardExpand all lines: packages/react-scripts/template/README.md
+63-1Lines changed: 63 additions & 1 deletion
Original file line number
Diff line number
Diff line change
@@ -1048,7 +1048,60 @@ Learn more about React Storybook:
1048
1048
1049
1049
## Making a Progressive Web App
1050
1050
1051
-
You can turn your React app into a [Progressive Web App](https://developers.google.com/web/progressive-web-apps/) by following the steps in [this repository](https://github.com/jeffposnick/create-react-pwa).
1051
+
By default, the production build is a fully functional, offline-first
1052
+
[Progressive Web App](https://developers.google.com/web/progressive-web-apps/).
1053
+
1054
+
The [`sw-precache-webpack-plugin`](https://github.com/goldhand/sw-precache-webpack-plugin)
1055
+
is integrated into [`webpack.config.prod.js`](../config/webpack.config.prod.js),
1056
+
and it will take care of generating a service worker file that will automatically
1057
+
precache all of your local assets and keep them up to date as you deploy updates.
1058
+
The service worker will use a [cache-first strategy](https://developers.google.com/web/fundamentals/instant-and-offline/offline-cookbook/#cache-falling-back-to-network)
1059
+
for handling all requests for local assets, including the initial HTML, ensuring
1060
+
that you web app is reliably fast, even on a slow or unreliable network.
1061
+
1062
+
It includes a [web app manifest](https://developers.google.com/web/fundamentals/engage-and-retain/web-app-manifest/),
1063
+
located at [`public/manifest.json`](public/manifest.json), that you might want
1064
+
to customize with metadata specific to your web application, such as its name
1065
+
and branding colors.
1066
+
1067
+
### Offline-First Considerations
1068
+
1069
+
1. The service worker is only enabled in the production environment. It's
1070
+
recommended that you do not enable an offline-first service worker in a
1071
+
development environment, as it can lead to frustration when previously cached
1072
+
assets are used and do not include the latest changes you've made locally.
1073
+
1074
+
1. If possible,configure your production environment to serve the generated
@@ -1096,6 +1149,15 @@ This is because when there is a fresh page load for a `/todos/42`, the server lo
1096
1149
1097
1150
Now requests to `/todos/42` will be handled correctly both in development and in production.
1098
1151
1152
+
On a production build, and in a browser that supports [service workers](https://developers.google.com/web/fundamentals/getting-started/primers/service-workers),
1153
+
the service worker will automatically handle all navigation requests, like for
1154
+
`/todos/42`, by serving the cached copy of your `index.html`. This
1155
+
service worker navigation routing can be configured or disabled by
1156
+
[`eject`ing](#npm-run-eject) and then modifying the
0 commit comments