Add lazy loading

.gitignore

@@ -21,3 +21,5 @@ pnpm-debug.log*
 *.njsproj
 *.sln
 *.sw?
+
+dist

src/components/PlayerList.vue

@@ -169,7 +169,7 @@ export default defineComponent({
 .playerHeaders {
   box-sizing: border-box;
   display: grid;
-  grid-template-columns: 5ch 20ch 6ch 6ch 6ch 10ch 1fr;
+  grid-template-columns: 6ch 20ch 6ch 6ch 6ch 10ch 1fr;
   background: var(--bg-color);
   text-align: left;
   cursor: pointer;
@@ -237,7 +237,7 @@ export default defineComponent({
 
   .playerRow,
   .playerHeaders {
-    grid-template-columns: 5ch 20ch 6ch 6ch 1fr;
+    grid-template-columns: 6ch 20ch 6ch 6ch 1fr;
   }
 }
 

src/router/index.ts

@@ -1,6 +1,6 @@
 import { createRouter, createWebHistory, RouteRecordRaw } from 'vue-router'
-import ServerView from '../views/ServerView.vue'
+const ServerView = () => import('../views/ServerView.vue')
-import PlayerView from '../views/PlayerView.vue'
+const PlayerView = () => import('../views/PlayerView.vue')
 
 const routes: Array<RouteRecordRaw> = [
   {

vue.config.js

@@ -1,5 +1,6 @@
 const { defineConfig } = require('@vue/cli-service')
 module.exports = defineConfig({
+  productionSourceMap: process.env.NODE_ENV !== 'production',
   transpileDependencies: true,
   publicPath: process.env.NODE_ENV === 'production' ? '/ToneAPI_webclient/' : '/',
   pages: {