[Client] Split some components to reduce bundle size

4 files changed, 15 insertions, 9 deletions

diff --git a/src/client/app/desktop/views/pages/deck/deck.vue b/src/client/app/desktop/views/pages/deck/deck.vue
index ea204d0fc0..533cec8130 100644
--- a/src/client/app/desktop/views/pages/deck/deck.vue
+++ b/src/client/app/desktop/views/pages/deck/deck.vue
@@ -25,9 +25,6 @@ import i18n from '../../../../i18n';
 import XColumnCore from './deck.column-core.vue';
 import Menu from '../../../../common/views/components/menu.vue';
 import MkUserListsWindow from '../../components/user-lists-window.vue';
-import XUserColumn from './deck.user-column.vue';
-import XNoteColumn from './deck.note-column.vue';
-import XHashtagColumn from './deck.hashtag-column.vue';
 
 import * as uuid from 'uuid';
 
@@ -35,9 +32,9 @@ export default Vue.extend({
 	i18n: i18n('deck'),
 	components: {
 		XColumnCore,
-		XUserColumn,
-		XNoteColumn,
-		XHashtagColumn
+		XUserColumn: () => import('./deck.user-column.vue').then(m => m.default),
+		XNoteColumn: () => import('./deck.note-column.vue').then(m => m.default),
+		XHashtagColumn: () => import('./deck.hashtag-column.vue').then(m => m.default)
 	},
 
 	computed: {
diff --git a/src/client/app/desktop/views/pages/drive.vue b/src/client/app/desktop/views/pages/drive.vue
index 46a3333c79..2916569a5f 100644
--- a/src/client/app/desktop/views/pages/drive.vue
+++ b/src/client/app/desktop/views/pages/drive.vue
@@ -1,6 +1,6 @@
 <template>
 <div class="mk-drive-page">
-	<mk-drive :init-folder="folder" @move-root="onMoveRoot" @open-folder="onOpenFolder"/>
+	<x-drive :init-folder="folder" @move-root="onMoveRoot" @open-folder="onOpenFolder"/>
 </div>
 </template>
 
@@ -10,6 +10,9 @@ import i18n from '../../../i18n';
 
 export default Vue.extend({
 	i18n: i18n('desktop/views/pages/drive.vue'),
+	components: {
+		XDrive: () => import('../components/drive.vue').then(m => m.default),
+	},
 	data() {
 		return {
 			folder: null
diff --git a/src/client/app/desktop/views/pages/messaging-room.vue b/src/client/app/desktop/views/pages/messaging-room.vue
index 8bb3976e5f..5bc28947cb 100644
--- a/src/client/app/desktop/views/pages/messaging-room.vue
+++ b/src/client/app/desktop/views/pages/messaging-room.vue
@@ -1,6 +1,6 @@
 <template>
 <div class="mk-messaging-room-page">
-	<mk-messaging-room v-if="user" :user="user" :is-naked="true"/>
+	<x-messaging-room v-if="user" :user="user" :is-naked="true"/>
 </div>
 </template>
 
@@ -13,6 +13,9 @@ import getUserName from '../../../../../misc/get-user-name';
 
 export default Vue.extend({
 	i18n: i18n('.vue'),
+	components: {
+		XMessagingRoom: () => import('../../../common/views/components/messaging-room.vue').then(m => m.default)
+	},
 	data() {
 		return {
 			fetching: true,
diff --git a/src/client/app/desktop/views/pages/selectdrive.vue b/src/client/app/desktop/views/pages/selectdrive.vue
index 422acb9890..7e6a8e1937 100644
--- a/src/client/app/desktop/views/pages/selectdrive.vue
+++ b/src/client/app/desktop/views/pages/selectdrive.vue
@@ -1,6 +1,6 @@
 <template>
 <div class="mkp-selectdrive">
-	<mk-drive ref="browser"
+	<x-drive ref="browser"
 		:multiple="multiple"
 		@selected="onSelected"
 		@change-selection="onChangeSelection"
@@ -19,6 +19,9 @@ import i18n from '../../../i18n';
 
 export default Vue.extend({
 	i18n: i18n('desktop/views/pages/selectdrive.vue'),
+	components: {
+		XDrive: () => import('../components/drive.vue').then(m => m.default),
+	},
 	data() {
 		return {
 			files: []