[Client] Split some components to reduce bundle size

This commit is contained in:
syuilo
2018-11-12 05:35:09 +09:00
parent fab389e624
commit 33e79e4bb8
19 changed files with 63 additions and 29 deletions

View File

@@ -6,7 +6,7 @@
<button class="close" @click="cancel"><fa icon="times"/></button>
<button v-if="multiple" class="ok" @click="ok"><fa icon="check"/></button>
</header>
<mk-drive class="drive" ref="browser"
<x-drive class="drive" ref="browser"
:select-file="true"
:multiple="multiple"
@change-selection="onChangeSelection"
@@ -22,6 +22,9 @@ import i18n from '../../../i18n';
export default Vue.extend({
i18n: i18n('mobile/views/components/drive-file-chooser.vue'),
components: {
XDrive: () => import('./drive.vue').then(m => m.default),
},
props: ['multiple'],
data() {
return {

View File

@@ -6,7 +6,7 @@
<button class="close" @click="cancel"><fa icon="times"/></button>
<button class="ok" @click="ok"><fa icon="check"/></button>
</header>
<mk-drive ref="browser"
<x-drive ref="browser"
select-folder
/>
</div>
@@ -18,6 +18,9 @@ import Vue from 'vue';
import i18n from '../../../i18n';
export default Vue.extend({
i18n: i18n('mobile/views/components/drive-folder-chooser.vue'),
components: {
XDrive: () => import('./drive.vue').then(m => m.default),
},
methods: {
cancel() {
this.$emit('canceled');

View File

@@ -5,7 +5,6 @@ import note from './note.vue';
import notes from './notes.vue';
import mediaImage from './media-image.vue';
import mediaVideo from './media-video.vue';
import drive from './drive.vue';
import notePreview from './note-preview.vue';
import subNoteContent from './sub-note-content.vue';
import noteCard from './note-card.vue';
@@ -29,7 +28,6 @@ Vue.component('mk-note', note);
Vue.component('mk-notes', notes);
Vue.component('mk-media-image', mediaImage);
Vue.component('mk-media-video', mediaVideo);
Vue.component('mk-drive', drive);
Vue.component('mk-note-preview', notePreview);
Vue.component('mk-sub-note-content', subNoteContent);
Vue.component('mk-note-card', noteCard);

View File

@@ -6,7 +6,7 @@
<template v-if="!folder && !file"><span style="margin-right:4px;"><fa icon="cloud"/></span>{{ $t('@.drive') }}</template>
</span>
<template slot="func"><button @click="fn"><fa icon="ellipsis-h"/></button></template>
<mk-drive
<x-drive
ref="browser"
:init-folder="initFolder"
:init-file="initFile"
@@ -29,6 +29,9 @@ import Progress from '../../../common/scripts/loading';
export default Vue.extend({
i18n: i18n(),
components: {
XDrive: () => import('../components/drive.vue').then(m => m.default),
},
data() {
return {
Progress,

View File

@@ -4,7 +4,7 @@
<template v-if="user"><span style="margin-right:4px;"><fa :icon="['far', 'comments']"/></span>{{ user | userName }}</template>
<template v-else><mk-ellipsis/></template>
</span>
<mk-messaging-room v-if="!fetching" :user="user" :is-naked="true"/>
<x-messaging-room v-if="!fetching" :user="user" :is-naked="true"/>
</mk-ui>
</template>
@@ -15,6 +15,9 @@ import parseAcct from '../../../../../misc/acct/parse';
export default Vue.extend({
i18n: i18n(),
components: {
XMessagingRoom: () => import('../../../common/views/components/messaging-room.vue').then(m => m.default)
},
data() {
return {
fetching: true,

View File

@@ -1,7 +1,7 @@
<template>
<mk-ui>
<span slot="header"><span style="margin-right:4px;"><fa :icon="['far', 'comments']"/></span>{{ $t('@.messaging') }}</span>
<mk-messaging @navigate="navigate" :header-top="48"/>
<x-messaging @navigate="navigate" :header-top="48"/>
</mk-ui>
</template>
@@ -12,6 +12,9 @@ import getAcct from '../../../../../misc/acct/render';
export default Vue.extend({
i18n: i18n(),
components: {
XMessaging: () => import('../../../common/views/components/messaging.vue').then(m => m.default)
},
mounted() {
document.title = `${this.$root.instanceName} ${this.$t('@.messaging')}`;
},

View File

@@ -5,7 +5,7 @@
<button class="upload" @click="upload"><fa icon="upload"/></button>
<button v-if="multiple" class="ok" @click="ok"><fa icon="check"/></button>
</header>
<mk-drive ref="browser" select-file :multiple="multiple" is-naked :top="$store.state.uiHeaderHeight"/>
<x-drive ref="browser" select-file :multiple="multiple" is-naked :top="$store.state.uiHeaderHeight"/>
</div>
</template>
@@ -15,6 +15,9 @@ import i18n from '../../../i18n';
export default Vue.extend({
i18n: i18n('mobile/views/pages/selectdrive.vue'),
components: {
XDrive: () => import('../components/drive.vue').then(m => m.default),
},
data() {
return {
files: []