upgraded react-scripts to 1.0.6, added latest PWA support of CRA

Roman Zanettin · Roman Zanettin · commit 7842a682f100 · 2017-05-24T16:25:48.000+02:00
diff --git a/.nvmrc b/.nvmrc
@@ -0,0 +1 @@
+7.0.0
diff --git a/.vscode/settings.json b/.vscode/settings.json
@@ -0,0 +1,3 @@
+{
+  "eslint.enable": false
+}
diff --git a/package.json b/package.json
@@ -4,7 +4,8 @@
   "private": true,
   "devDependencies": {
     "babel-cli": "^6.24.1",
-    "react-scripts": "0.8.5"
+    "babel-preset-env": "^1.5.1",
+    "react-scripts": "1.0.6"
   },
   "dependencies": {
     "body-parser": "^1.17.1",
diff --git a/public/index.html b/public/index.html
@@ -3,9 +3,15 @@
   <head>
     <meta charset="utf-8">
     <meta name="viewport" content="width=device-width, initial-scale=1">
-    <link rel="shortcut icon" href="%PUBLIC_URL%/favicons/favicon.ico">
+    <meta name="theme-color" content="#000000">
     <!--
-      Notice the use of %PUBLIC_URL% in the tag above.
+      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/
+    -->
+    <link rel="manifest" href="%PUBLIC_URL%/manifest.json">
+    <link rel="shortcut icon" href="%PUBLIC_URL%/favicon.ico">
+    <!--
+      Notice the use of %PUBLIC_URL% in the tags above.
       It will be replaced with the URL of the `public` folder during the build.
       Only files inside the `public` folder can be referenced from the HTML.
 
diff --git a/public/manifest.json b/public/manifest.json
@@ -0,0 +1,15 @@
+{
+  "short_name": "SSR React App",
+  "name": "SSR Create React App Sample",
+  "icons": [
+    {
+      "src": "favicons/favicon.ico",
+      "sizes": "192x192",
+      "type": "image/png"
+    }
+  ],
+  "start_url": "./index.html",
+  "display": "standalone",
+  "theme_color": "#000000",
+  "background_color": "#ffffff"
+}
diff --git a/server/app.js b/server/app.js
@@ -6,7 +6,10 @@ const morgan = require('morgan')
 const path = require('path')
 const fs = require('fs')
 
-require('babel-register')({ ignore: /\/(build|node_modules)\//, presets: ['react-app'] })
+require('babel-register')({
+  ignore: /\/(build|node_modules)\//,
+  presets: ['env', 'react-app']
+})
 
 // routes
 const index = require('./routes/index')
@@ -19,7 +22,7 @@ const app = express()
 // Support Gzip
 app.use(compression())
 
-// Suport post requests with body data (doesn't support multipart, use multer)
+// Support post requests with body data (doesn't support multipart, use multer)
 app.use(bodyParser.json())
 app.use(bodyParser.urlencoded({ extended: false }))
 
diff --git a/src/index.js b/src/index.js
@@ -6,6 +6,7 @@ import { BrowserRouter } from 'react-router-dom'
 import configureStore from './store'
 import './index.css'
 import App from './containers/App'
+import registerServiceWorker from './registerServiceWorker'
 
 // Let the reducers handle initial state
 const initialState = {}
@@ -19,5 +20,4 @@ ReactDOM.render(
   </Provider>
 , document.getElementById('root')
 )
-
-
+registerServiceWorker()
diff --git a/src/registerServiceWorker.js b/src/registerServiceWorker.js
@@ -0,0 +1,51 @@
+// In production, we register a service worker to serve assets from local cache.
+
+// This lets the app load faster on subsequent visits in production, and gives
+// it offline capabilities. However, it also means that developers (and users)
+// will only see deployed updates on the "N+1" visit to a page, since previously
+// cached resources are updated in the background.
+
+// To learn more about the benefits of this model, read https://goo.gl/KwvDNy.
+// This link also includes instructions on opting out of this behavior.
+
+export default function register() {
+  if (process.env.NODE_ENV === 'production' && 'serviceWorker' in navigator) {
+    window.addEventListener('load', () => {
+      const swUrl = `${process.env.PUBLIC_URL}/service-worker.js`;
+      navigator.serviceWorker
+        .register(swUrl)
+        .then(registration => {
+          registration.onupdatefound = () => {
+            const installingWorker = registration.installing;
+            installingWorker.onstatechange = () => {
+              if (installingWorker.state === 'installed') {
+                if (navigator.serviceWorker.controller) {
+                  // At this point, the old content will have been purged and
+                  // the fresh content will have been added to the cache.
+                  // It's the perfect time to display a "New content is
+                  // available; please refresh." message in your web app.
+                  console.log('New content is available; please refresh.');
+                } else {
+                  // At this point, everything has been precached.
+                  // It's the perfect time to display a
+                  // "Content is cached for offline use." message.
+                  console.log('Content is cached for offline use.');
+                }
+              }
+            };
+          };
+        })
+        .catch(error => {
+          console.error('Error during service worker registration:', error);
+        });
+    });
+  }
+}
+
+export function unregister() {
+  if ('serviceWorker' in navigator) {
+    navigator.serviceWorker.ready.then(registration => {
+      registration.unregister();
+    });
+  }
+}
diff --git a/yarn.lock b/yarn.lock

Original file line number	Diff line number	Diff line change
`@@ -0,0 +1,3 @@`
	`1`	`+{`
	`2`	`+ "eslint.enable": false`
	`3`	`+}`