ui: external module support

packages/ui-default/components/monaco/loader.ts

@@ -1,3 +1,5 @@
+import loadExternalModule from 'vj/utils/loadModule';
+
 let loaded;
 const loaders = {
   i18n: async () => {
@@ -16,6 +18,11 @@ const loaders = {
   markdown: () => import('./languages/markdown'),
   typescript: () => import('./languages/typescript'),
   yaml: () => import('./languages/yaml'),
+  external: async (monaco, feat) => {
+    let apply = await loadExternalModule(window.externalModules[`monaco-${feat}`]);
+    if (typeof apply !== 'function') apply = apply.default || apply.apply;
+    if (typeof apply === 'function') await apply(monaco);
+  },
 };
 
 export async function load(features = ['markdown']) {
@@ -26,18 +33,19 @@ export async function load(features = ['markdown']) {
   }
   const res = await import('./index');
   if (!loaded) {
-    console.log('Loaded monaco editor in ', Date.now() - s, 'ms');
+    console.log('Loaded monaco editor in', Date.now() - s, 'ms');
     loaded = [];
   }
   for (const feat of features) {
     if (loaded.includes(feat)) continue;
-    if (!loaders[feat]) {
+    if (!loaders[feat] && !window.externalModules[`monaco-${feat}`]) {
       console.error('Unknown monaco feature:', feat);
       continue;
     }
     s = Date.now();
     console.log('Loading monaco feature:', feat);
-    await loaders[feat]();
+    if (loaders[feat]) await loaders[feat]();
+    else await loaders.external(res.default, feat);
     console.log('Loaded monaco feature:', feat, 'in', Date.now() - s, 'ms');
     loaded.push(feat);
   }