From 69971198afbcf3484931ba81be83a200a0f7f7cc Mon Sep 17 00:00:00 2001
From: Liyas Thomas <liyasthomas@gmail.com>
Date: Sat, 16 Nov 2019 00:25:05 +0530
Subject: [PATCH] =?UTF-8?q?=E2=9A=97=20Lazy=20component=20import?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 components/collections/addCollection.vue      |  4 +---
 components/collections/addFolder.vue          |  4 +---
 components/collections/collection.vue         |  7 ++----
 components/collections/editCollection.vue     |  4 +---
 components/collections/editFolder.vue         |  4 +---
 components/collections/editRequest.vue        |  4 +---
 components/collections/folder.vue             |  4 +---
 .../collections/importExportCollections.vue   |  4 +---
 components/collections/index.vue              | 22 ++++++------------
 components/collections/saveRequestAs.vue      |  4 +---
 components/history.vue                        |  6 ++---
 layouts/default.vue                           |  6 ++---
 pages/index.vue                               | 23 +++++++------------
 13 files changed, 29 insertions(+), 67 deletions(-)

diff --git a/components/collections/addCollection.vue b/components/collections/addCollection.vue
index c5ec80843..9a00ed2a6 100644
--- a/components/collections/addCollection.vue
+++ b/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 {
diff --git a/components/collections/addFolder.vue b/components/collections/addFolder.vue
index 38b4796f8..3a582c13a 100644
--- a/components/collections/addFolder.vue
+++ b/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 {
diff --git a/components/collections/collection.vue b/components/collections/collection.vue
index 34652dbe6..e58e09b18 100644
--- a/components/collections/collection.vue
+++ b/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,
diff --git a/components/collections/editCollection.vue b/components/collections/editCollection.vue
index 16b629139..fd7271bf1 100644
--- a/components/collections/editCollection.vue
+++ b/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 {
diff --git a/components/collections/editFolder.vue b/components/collections/editFolder.vue
index b9427caf9..271e78d17 100644
--- a/components/collections/editFolder.vue
+++ b/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 {
diff --git a/components/collections/editRequest.vue b/components/collections/editRequest.vue
index ca20272e2..46a9eb716 100644
--- a/components/collections/editRequest.vue
+++ b/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 {
diff --git a/components/collections/folder.vue b/components/collections/folder.vue
index 4b2d6a4ce..3517c6277 100644
--- a/components/collections/folder.vue
+++ b/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 {
diff --git a/components/collections/importExportCollections.vue b/components/collections/importExportCollections.vue
index 7d7b822ae..b70f97f70 100644
--- a/components/collections/importExportCollections.vue
+++ b/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() {
diff --git a/components/collections/index.vue b/components/collections/index.vue
index 01e7af960..5eab76795 100644
--- a/components/collections/index.vue
+++ b/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 {
diff --git a/components/collections/saveRequestAs.vue b/components/collections/saveRequestAs.vue
index 0d51b83ae..5440f527e 100644
--- a/components/collections/saveRequestAs.vue
+++ b/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 {
diff --git a/components/history.vue b/components/history.vue
index 24190dc32..89662a95e 100644
--- a/components/history.vue
+++ b/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(
diff --git a/layouts/default.vue b/layouts/default.vue
index 898cc9d25..d7e39237a 100644
--- a/layouts/default.vue
+++ b/layouts/default.vue
@@ -267,14 +267,12 @@
 
 <script>
 import intializePwa from "../assets/js/pwa";
-import logo from "../components/logo";
 import * as version from "../.postwoman/version.json";
-import modal from "../components/modal";
 
 export default {
   components: {
-    logo,
-    modal
+    logo: () => import("../components/logo"),
+    modal: () => import("../components/modal")
   },
 
   methods: {
diff --git a/pages/index.vue b/pages/index.vue
index 145987868..3d3c76c12 100644
--- a/pages/index.vue
+++ b/pages/index.vue
@@ -747,18 +747,11 @@
   </div>
 </template>
 <script>
+import section from "../components/section";
 import url from "url";
 import querystring from "querystring";
-import autocomplete from "../components/autocomplete";
-import history from "../components/history";
-import section from "../components/section";
 import textareaAutoHeight from "../directives/textareaAutoHeight";
-import toggle from "../components/toggle";
-import modal from "../components/modal";
-import collections from "../components/collections";
-import saveRequestAs from "../components/collections/saveRequestAs";
 import parseCurlCommand from "../assets/js/curlparser.js";
-import AceEditor from "../components/ace-editor";
 import getEnvironmentVariablesFromScript from "../functions/preRequest";
 import parseTemplateString from "../functions/templating";
 
@@ -819,13 +812,13 @@ export default {
 
   components: {
     "pw-section": section,
-    "pw-toggle": toggle,
-    "pw-modal": modal,
-    history,
-    autocomplete,
-    collections,
-    saveRequestAs,
-    ResponseBody: AceEditor
+    "pw-toggle": () => import("../components/toggle"),
+    "pw-modal": () => import("../components/modal"),
+    history: () => import("../components/history"),
+    autocomplete: () => import("../components/autocomplete"),
+    collections: () => import("../components/collections"),
+    saveRequestAs: () => import("../components/collections/saveRequestAs"),
+    ResponseBody: () => import("../components/ace-editor")
   },
   data() {
     return {