Add pwa support

Author: SleepyHeeead

public/index.html

@@ -4,6 +4,7 @@
     <meta charset="utf-8">
     <meta http-equiv="X-UA-Compatible" content="IE=edge">
     <meta name="viewport" content="width=device-width,initial-scale=1.0">
+    <meta name="theme-color" content="#00142A">
     <link rel="icon" href="<%= BASE_URL %>favicon.ico">
     <title>sub-web</title>
   </head>

public/manifest.json

@@ -0,0 +1,20 @@
+{
+    "short_name": "sub-web",
+    "name": "sub-web",
+    "icon": [
+        {
+            "src": "./img/icons/icon-192x192.png",
+            "sizes": "192x192",
+            "type": "image/png"
+        },
+        {
+            "src": "./img/icons/android-chrome-512x512.png",
+            "sizes": "512x512",
+            "type": "image/png"
+        }
+    ],
+    "start_url": "index.html",
+    "display": "standalone",
+    "background_color": "#002140",
+    "theme_color": "#002140"
+}

src/registerServiceWorker.js

@@ -3,7 +3,7 @@
 import { register } from 'register-service-worker'
 
 if (process.env.NODE_ENV === 'production') {
-  register(`${process.env.BASE_URL}service-worker.js`, {
+  register(`${process.env.BASE_URL}sub-web.js`, {
     ready () {
       console.log(
         'App is being served from cache by a service worker.\n' +

vue.config.js

@@ -30,5 +30,17 @@ module.exports = {
         symbolId: 'icon-[name]'
       })
       .end()
+  },
+
+  pwa: {
+    workboxOptions: {
+      // https://developers.google.com/web/tools/workbox/modules/workbox-webpack-plugin
+      skipWaiting: true,
+      clientsClaim: true,
+      importWorkboxFrom: 'local',
+      importsDirectory: 'js',
+      navigateFallback: '/',
+      navigateFallbackBlacklist: [/\/api\//]
+    }
   }
 };