From 9923f795928fcc380028137c2e7e405de73fbbd9 Mon Sep 17 00:00:00 2001 From: Piotr Konieczny Date: Fri, 19 Jan 2018 19:57:50 +0100 Subject: [PATCH] Revert "Remove the navigateFallback behavior from the generated service worker (#3419)" This reverts commit b6aebb9e8f2e1bb049e855e739e578bd00d90021. # Conflicts: # packages/react-scripts/template/README.md --- .../config/webpack.config.prod.js | 9 +++-- packages/react-scripts/template/README.md | 40 ++++++------------- 2 files changed, 18 insertions(+), 31 deletions(-) diff --git a/packages/react-scripts/config/webpack.config.prod.js b/packages/react-scripts/config/webpack.config.prod.js index c0c1071cbd0..2813092162f 100644 --- a/packages/react-scripts/config/webpack.config.prod.js +++ b/packages/react-scripts/config/webpack.config.prod.js @@ -442,12 +442,13 @@ module.exports = { console.log(message); }, minify: true, + // For unknown URLs, fallback to the index page + navigateFallback: publicUrl + '/index.html', + // Ignores URLs starting from /__ (useful for Firebase): + // https://github.com/facebookincubator/create-react-app/issues/2237#issuecomment-302693219 + navigateFallbackWhitelist: [/^(?!\/__).*/], // Don't precache sourcemaps (they're large) and build asset manifest: staticFileGlobsIgnorePatterns: [/\.map$/, /asset-manifest\.json$/], - // `navigateFallback` and `navigateFallbackWhitelist` are disabled by default; see - // https://github.com/facebookincubator/create-react-app/blob/master/packages/react-scripts/template/README.md#service-worker-considerations - // navigateFallback: publicUrl + '/index.html', - // navigateFallbackWhitelist: [/^(?!\/__).*/], }), // Moment.js is an extremely popular library that bundles large locale files // by default due to how Webpack interprets its code. This is a practical diff --git a/packages/react-scripts/template/README.md b/packages/react-scripts/template/README.md index 04dc4d9b971..3e8938285aa 100644 --- a/packages/react-scripts/template/README.md +++ b/packages/react-scripts/template/README.md @@ -83,7 +83,6 @@ You can find the most recent version of this guide [here](https://github.com/fac - [Static Server](#static-server) - [Other Solutions](#other-solutions) - [Serving Apps with Client-Side Routing](#serving-apps-with-client-side-routing) - - [Service Worker Considerations](#service-worker-considerations) - [Building for Relative Paths](#building-for-relative-paths) - [Azure](#azure) - [Firebase](#firebase) @@ -1839,14 +1838,8 @@ is integrated into production configuration, and it will take care of generating a service worker file that will automatically precache all of your local assets and keep them up to date as you deploy updates. 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) -for handling all requests for local assets, including -[navigation requests](https://developers.google.com/web/fundamentals/primers/service-workers/high-performance-loading#first_what_are_navigation_requests) -for `/` and `/index.html`, ensuring that your web app is consistently fast, even -on a slow or unreliable network. - ->Note: If you are using the `pushState` history API and want to enable -cache-first navigations for URLs other than `/` and `/index.html`, please -[follow these steps](#service-worker-considerations). +for handling all requests for local assets, including the initial HTML, ensuring +that your web app is reliably fast, even on a slow or unreliable network. ### Opting Out of Caching @@ -2049,27 +2042,20 @@ If you’re using [Apache Tomcat](http://tomcat.apache.org/), you need to follow Now requests to `/todos/42` will be handled correctly both in development and in production. -When users install your app to the homescreen of their device the default configuration will make a shortcut to `/`. This may not work if you don't use a client-side router and expect the app to be served from `/index.html`. In this case, the web app manifest at [`public/manifest.json`](public/manifest.json) and change `start_url` to `./index.html`. - -### Service Worker Considerations - -[Navigation requests](https://developers.google.com/web/fundamentals/primers/service-workers/high-performance-loading#first_what_are_navigation_requests) -for URLs like `/todos/42` will not be intercepted by the -[service worker](https://developers.google.com/web/fundamentals/getting-started/primers/service-workers) -created by the production build. Navigations for those URLs will always -require a network connection, as opposed to navigations for `/` and -`/index.html`, both of which will be served from the cache by the service worker -and work without requiring a network connection. - -If you are using the `pushState` history API and would like to enable service -worker support for navigations to URLs like `/todos/42`, you need to -[`npm eject`](#npm-run-eject) and enable the [`navigateFallback`](https://github.com/GoogleChrome/sw-precache#navigatefallback-string) +On a production build, and in a browser that supports [service workers](https://developers.google.com/web/fundamentals/getting-started/primers/service-workers), +the service worker will automatically handle all navigation requests, like for +`/todos/42`, by serving the cached copy of your `index.html`. This +service worker navigation routing can be configured or disabled by +[`eject`ing](#npm-run-eject) and then modifying the +[`navigateFallback`](https://github.com/GoogleChrome/sw-precache#navigatefallback-string) and [`navigateFallbackWhitelist`](https://github.com/GoogleChrome/sw-precache#navigatefallbackwhitelist-arrayregexp) options of the `SWPreachePlugin` [configuration](../config/webpack.config.prod.js). ->Note: This is a [change in default behavior](https://github.com/facebookincubator/create-react-app/issues/3248), -as earlier versions of `create-react-app` shipping with `navigateFallback` -enabled by default. +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: + +```js + "start_url": ".", +``` ### Building for Relative Paths