graphite/Sharkey
1
0
Fork 0
mirror of https://git.joinsharkey.org/Sharkey/Sharkey.git synced 2024-11-27 17:43:09 +02:00
Code Issues Projects Releases Packages Wiki Activity

[Client] Use dynamic import to reduce bundle size

Browse source
This commit is contained in:
syuilo 2018-11-06 15:37:41 +09:00
parent fb8af53751
commit 6d67cd07a0
No known key found for this signature in database
GPG key ID: BDC4C49D06AB9D69
4 changed files with 12 additions and 5 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
src/client/app/common/views/components/index.ts
View file

@ -40,7 +40,6 @@ import twitterSetting from './twitter-setting.vue';
import githubSetting from './github-setting.vue'; import githubSetting from './github-setting.vue';
import fileTypeIcon from './file-type-icon.vue'; import fileTypeIcon from './file-type-icon.vue';
import emoji from './emoji.vue'; import emoji from './emoji.vue';
import Reversi from './games/reversi/reversi.vue';
import welcomeTimeline from './welcome-timeline.vue'; import welcomeTimeline from './welcome-timeline.vue';
import uiInput from './ui/input.vue'; import uiInput from './ui/input.vue';
import uiButton from './ui/button.vue'; import uiButton from './ui/button.vue';
@ -95,7 +94,6 @@ Vue.component('mk-twitter-setting', twitterSetting);
Vue.component('mk-github-setting', githubSetting); Vue.component('mk-github-setting', githubSetting);
Vue.component('mk-file-type-icon', fileTypeIcon); Vue.component('mk-file-type-icon', fileTypeIcon);
Vue.component('mk-emoji', emoji); Vue.component('mk-emoji', emoji);
Vue.component('mk-reversi', Reversi);
Vue.component('mk-welcome-timeline', welcomeTimeline); Vue.component('mk-welcome-timeline', welcomeTimeline);
Vue.component('ui-input', uiInput); Vue.component('ui-input', uiInput);
Vue.component('ui-button', uiButton); Vue.component('ui-button', uiButton);

5
src/client/app/desktop/views/components/game-window.vue
View file

@ -1,7 +1,7 @@
<template> <template>
<mk-window ref="window" width="500px" height="560px" :popout-url="popout" @closed="destroyDom"> <mk-window ref="window" width="500px" height="560px" :popout-url="popout" @closed="destroyDom">
<span slot="header" :class="$style.header"><fa icon="gamepad"/>%i18n:@game%</span> <span slot="header" :class="$style.header"><fa icon="gamepad"/>%i18n:@game%</span>
<mk-reversi :class="$style.content" @gamed="g => game = g"/> <x-reversi :class="$style.content" @gamed="g => game = g"/>
</mk-window> </mk-window>
</template> </template>
@ -10,6 +10,9 @@ import Vue from 'vue';
import { url } from '../../../config'; import { url } from '../../../config';
export default Vue.extend({ export default Vue.extend({
components: {
XReversi: () => import('../../../common/views/components/games/reversi/reversi.vue')
},
data() { data() {
return { return {
game: null game: null

5
src/client/app/desktop/views/pages/games/reversi.vue
View file

@ -1,6 +1,6 @@
<template> <template>
<component :is="ui ? 'mk-ui' : 'div'"> <component :is="ui ? 'mk-ui' : 'div'">
<mk-reversi :game-id="$route.params.game" @nav="nav" :self-nav="false"/> <x-reversi :game-id="$route.params.game" @nav="nav" :self-nav="false"/>
</component> </component>
</template> </template>
@ -8,6 +8,9 @@
import Vue from 'vue'; import Vue from 'vue';
export default Vue.extend({ export default Vue.extend({
components: {
XReversi: () => import('../../../../common/views/components/games/reversi/reversi.vue')
},
props: { props: {
ui: { ui: {
default: false default: false

5
src/client/app/mobile/views/pages/games/reversi.vue
View file

@ -1,7 +1,7 @@
<template> <template>
<mk-ui> <mk-ui>
<span slot="header"><span style="margin-right:4px;"><fa icon="gamepad"/></span>%i18n:@reversi%</span> <span slot="header"><span style="margin-right:4px;"><fa icon="gamepad"/></span>%i18n:@reversi%</span>
<mk-reversi :game-id="$route.params.game" @nav="nav" :self-nav="false"/> <x-reversi :game-id="$route.params.game" @nav="nav" :self-nav="false"/>
</mk-ui> </mk-ui>
</template> </template>
@ -9,6 +9,9 @@
import Vue from 'vue'; import Vue from 'vue';
export default Vue.extend({ export default Vue.extend({
components: {
XReversi: () => import('../../../../common/views/components/games/reversi/reversi.vue')
},
mounted() { mounted() {
document.title = `${(this as any).os.instanceName} %i18n:@reversi%`; document.title = `${(this as any).os.instanceName} %i18n:@reversi%`;
}, },