⚗ Lazy component import

components/collections/addCollection.vue

@@ -35,14 +35,12 @@
 </template>
 
 <script>
-import modal from "../../components/modal";
-
 export default {
   props: {
     show: Boolean
   },
   components: {
-    modal
+    modal: () => import("../../components/modal")
   },
   data() {
     return {

components/collections/addFolder.vue

@@ -35,8 +35,6 @@
 </template>
 
 <script>
-import modal from "../../components/modal";
-
 export default {
   props: {
     show: Boolean,
@@ -44,7 +42,7 @@ export default {
     collectionIndex: Number
   },
   components: {
-    modal
+    modal: () => import("../../components/modal")
   },
   data() {
     return {

components/collections/collection.vue

@@ -129,13 +129,10 @@ ul li {
 </style>
 
 <script>
-import folder from "./folder";
-import request from "./request";
-
 export default {
   components: {
-    folder,
-    request
+    folder: () => import("./folder"),
+    request: () => import("./request")
   },
   props: {
     collectionIndex: Number,

components/collections/editCollection.vue

@@ -40,8 +40,6 @@
 </template>
 
 <script>
-import modal from "../../components/modal";
-
 export default {
   props: {
     show: Boolean,
@@ -49,7 +47,7 @@ export default {
     editingCollectionIndex: Number
   },
   components: {
-    modal
+    modal: () => import("../../components/modal")
   },
   data() {
     return {

components/collections/editFolder.vue

@@ -40,8 +40,6 @@
 </template>
 
 <script>
-import modal from "../../components/modal";
-
 export default {
   props: {
     show: Boolean,
@@ -51,7 +49,7 @@ export default {
     folderIndex: Number
   },
   components: {
-    modal
+    modal: () => import("../../components/modal")
   },
   data() {
     return {

components/collections/editRequest.vue

@@ -72,8 +72,6 @@
 </template>
 
 <script>
-import modal from "../../components/modal";
-
 export default {
   props: {
     show: Boolean,
@@ -83,7 +81,7 @@ export default {
     requestIndex: Number
   },
   components: {
-    modal
+    modal: () => import("../../components/modal")
   },
   data() {
     return {

components/collections/folder.vue

@@ -88,8 +88,6 @@ ul li {
 </style>
 
 <script>
-import request from "./request";
-
 export default {
   props: {
     folder: Object,
@@ -97,7 +95,7 @@ export default {
     folderIndex: Number
   },
   components: {
-    request
+    request: () => import("./request")
   },
   data() {
     return {

components/collections/importExportCollections.vue

@@ -63,14 +63,12 @@
 </template>
 
 <script>
-import modal from "../../components/modal";
-
 export default {
   props: {
     show: Boolean
   },
   components: {
-    modal
+    modal: () => import("../../components/modal")
   },
   computed: {
     collectionJson() {

components/collections/index.vue

@@ -92,23 +92,15 @@ ul {
 </style>
 
 <script>
-import addCollection from "./addCollection";
-import addFolder from "./addFolder";
-import collection from "./collection";
-import editCollection from "./editCollection";
-import editFolder from "./editFolder";
-import editRequest from "./editRequest";
-import importExportCollections from "./importExportCollections";
-
 export default {
   components: {
-    addCollection,
-    addFolder,
-    collection,
-    editCollection,
-    editFolder,
-    editRequest,
-    importExportCollections
+    addCollection: () => import("./addCollection"),
+    addFolder: () => import("./addFolder"),
+    collection: () => import("./collection"),
+    editCollection: () => import("./editCollection"),
+    editFolder: () => import("./editFolder"),
+    editRequest: () => import("./editRequest"),
+    importExportCollections: () => import("./importExportCollections")
   },
   data() {
     return {

components/collections/saveRequestAs.vue

@@ -93,15 +93,13 @@
 </template>
 
 <script>
-import modal from "../../components/modal";
-
 export default {
   props: {
     show: Boolean,
     editingRequest: Object
   },
   components: {
-    modal
+    modal: () => import("../../components/modal")
   },
   data() {
     return {

components/history.vue

@@ -318,16 +318,14 @@ label {
 </style>
 
 <script>
-import VirtualList from "vue-virtual-scroll-list";
-import section from "./section";
 import { findStatusGroup } from "../pages/index";
 
 const updateOnLocalStorage = (propertyName, property) =>
   window.localStorage.setItem(propertyName, JSON.stringify(property));
 export default {
   components: {
-    "pw-section": section,
-    VirtualList
+    "pw-section": () => import("./section"),
+    VirtualList: () => import("vue-virtual-scroll-list")
   },
   data() {
     const localStorageHistory = JSON.parse(