mirror of
https://github.com/directus/directus.git
synced 2026-01-31 23:18:03 -05:00
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:
@@ -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;
|
||||
|
||||
@@ -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: [
|
||||
{
|
||||
|
||||
@@ -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);
|
||||
|
||||
|
||||
@@ -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) {
|
||||
|
||||
Reference in New Issue
Block a user