Reduced chunk vendor build size ( Parsed size from 3.48MB to 1.19MB ) (#4645)

Split out wysiwyg and markdown code into a separate chunk.
This commit is contained in:
Ngai Kam Wing
2021-03-25 00:09:11 +08:00
committed by GitHub
parent 73b98b4ae8
commit e9f18975d8
4 changed files with 14 additions and 9 deletions

View File

@@ -1,5 +1,5 @@
import VueI18n from 'vue-i18n';
import { Component } from 'vue';
import { Component, AsyncComponent } from 'vue';
import { Field, types, localTypes } from '@/types';
export type InterfaceConfig = {
@@ -7,8 +7,8 @@ export type InterfaceConfig = {
icon: string;
name: string | VueI18n.TranslateResult;
description?: string | VueI18n.TranslateResult;
component: Component;
options: DeepPartial<Field>[] | Component;
component: Component | AsyncComponent;
options: DeepPartial<Field>[] | Component | AsyncComponent;
types: typeof types[number][];
groups?: readonly typeof localTypes[number][];
relational?: boolean;

View File

@@ -1,12 +1,15 @@
import InterfaceWYSIWYG from './wysiwyg.vue';
import { AsyncComponent } from 'vue';
import { defineInterface } from '@/interfaces/define';
const InterfaceWYSIWYG = () =>
import(/* webpackChunkName: 'interface-wysiwyg', webpackPrefetch: true */ './wysiwyg.vue');
export default defineInterface(({ i18n }) => ({
id: 'wysiwyg',
name: i18n.t('interfaces.wysiwyg.wysiwyg'),
description: i18n.t('interfaces.wysiwyg.description'),
icon: 'format_quote',
component: InterfaceWYSIWYG,
component: InterfaceWYSIWYG as AsyncComponent,
types: ['text'],
options: [
{

View File

@@ -27,11 +27,13 @@
</template>
<script lang="ts">
import { AsyncComponent } from 'vue';
import { defineComponent, ref, computed } from '@vue/composition-api';
import DocsNavigation from '../components/navigation.vue';
import Markdown from '../components/markdown.vue';
import marked from 'marked';
const Markdown = () => import(/* webpackChunkName: 'markdown', webpackPrefetch: true */ '../components/markdown.vue');
async function getMarkdownForPath(path: string) {
const pathParts = path.split('/');
@@ -52,7 +54,7 @@ async function getMarkdownForPath(path: string) {
export default defineComponent({
name: 'StaticDocs',
components: { DocsNavigation, Markdown },
components: { DocsNavigation, Markdown: Markdown as AsyncComponent },
async beforeRouteEnter(to, from, next) {
const md = await getMarkdownForPath(to.path);

View File

@@ -1,6 +1,6 @@
import Vue, { Component } from 'vue';
import Vue, { Component, AsyncComponent } from 'vue';
function registerComponent(id: string, component: Component): void;
function registerComponent(id: string, component: Component | AsyncComponent): void;
function registerComponent(id: string, component: Parameters<typeof Vue.component>[1]): void;
function registerComponent(id: string, component: any) {