🐛 manually specify routes for lazy loading

client/router.js

@@ -0,0 +1,72 @@
+import Vue from 'vue';
+import Router from 'vue-router';
+
+const Index = () =>
+  import(/* webpackChunkName: "group-index" */ '@/pages/index.vue').then(m => m.default || m);
+const Login = () =>
+  import(/* webpackChunkName: "group-login" */ '@/pages/login.vue').then(m => m.default || m);
+const Register = () =>
+  import(/* webpackChunkName: "group-register" */ '@/pages/register.vue').then(m => m.default || m);
+const Results = () =>
+  import(/* webpackChunkName: "group-results" */ '@/pages/results.vue').then(m => m.default || m);
+const Watch = () =>
+  import(/* webpackChunkName: "group-watch" */ '@/pages/watch.vue').then(m => m.default || m);
+
+const Channel = () =>
+  import(/* webpackChunkName: "group-channel" */ '@/pages/channel.vue').then(m => m.default || m);
+const Embed = () =>
+  import(/* webpackChunkName: "group-embed" */ '@/pages/embed.vue').then(m => m.default || m);
+const SubscriptionIndex = () =>
+  import(/* webpackChunkName: "group-subscription" */ '@/pages/subscriptions/index.vue').then(
+    m => m.default || m
+  );
+const SubscriptionManage = () =>
+  import(/* webpackChunkName: "group-subscription" */ '@/pages/subscriptions/manage.vue').then(
+    m => m.default || m
+  );
+
+Vue.use(Router);
+
+export function createRouter() {
+  return new Router({
+    mode: 'history',
+    routes: [
+      {
+        path: '/',
+        component: Index
+      },
+      {
+        path: '/login',
+        component: Login
+      },
+      {
+        path: '/register',
+        component: Register
+      },
+      {
+        path: '/results',
+        component: Results
+      },
+      {
+        path: '/watch',
+        component: Watch
+      },
+      {
+        path: '/embed/:id',
+        component: Embed
+      },
+      {
+        path: '/channel/:id',
+        component: Channel
+      },
+      {
+        path: '/subscriptions',
+        component: SubscriptionIndex
+      },
+      {
+        path: '/subscriptions/manage',
+        component: SubscriptionManage
+      }
+    ]
+  });
+}

nuxt.config.js

@@ -94,7 +94,7 @@ module.exports = {
   },
   // },
 
-  buildModules: [],
+  buildModules: ['@nuxtjs/router'],
 
   modules: [
     '@nuxtjs/style-resources',
@@ -132,7 +132,7 @@ module.exports = {
     transpile: ['vue-material-design-icons', 'dashjs', 'tippy.js'],
     extend(config, { isClient }) {
       if (isClient) {
-        config.optimization.splitChunks.maxSize = 200000;
+        config.optimization.splitChunks.maxSize = 1000000;
       }
     }
   }

package.json

@@ -52,6 +52,7 @@
     "@nestjs/swagger": "^4.5.12",
     "@nestjs/testing": "^7.4.4",
     "@nuxtjs/axios": "^5.12.2",
+    "@nuxtjs/router": "^1.5.0",
     "@nuxtjs/style-resources": "^1.0.0",
     "@nuxtjs/workbox": "^3.0.0-beta.16",
     "@types/bcryptjs": "^2.4.2",

yarn.lock

@@ -1639,6 +1639,13 @@
   resolved "https://registry.yarnpkg.com/@nuxtjs/pwa-utils/-/pwa-utils-3.0.0-beta.16.tgz#808ddb090f3831c5b32931ab2d08231cc55abff9"
   integrity sha512-3sF8iAstLi/dbQ39S4Zdy/QsK5IArgJ2s/nuGxOTVuxz01m07VdMbJejzsdYbyz31mQP0w4IPFNYOCPZhcvVig==
 
+"@nuxtjs/router@^1.5.0":
+  version "1.5.0"
+  resolved "https://registry.yarnpkg.com/@nuxtjs/router/-/router-1.5.0.tgz#bed68f841b7a3457908c9ed36148172d75aa976f"
+  integrity sha512-LiWvlikpUaBqj8QVBzvo50pnK+8Wj6U9OkS/osYDD7dj0Et5L50pkO+VxVZq4r4boHfki/II98MKXoiTDH/+GQ==
+  dependencies:
+    consola "^2.10.1"
+
 "@nuxtjs/style-resources@^1.0.0":
   version "1.0.0"
   resolved "https://registry.yarnpkg.com/@nuxtjs/style-resources/-/style-resources-1.0.0.tgz#7c4d6be19d7f7cc5d687d689f2ab16c0b94773a1"