feat(utils|types): add esmodule support for component meta resources (#2603)

* feat(utils): support script type param for assest loader

* feat(types): update AssestsJson type

Author: keuby

packages/types/src/shell/type/remote-component-description.ts

@@ -1,17 +1,21 @@
+import { Asset } from '../../assets';
 import { IPublicTypeComponentMetadata, IPublicTypeReference } from './';
 
 /**
  * 远程物料描述
  */
 export interface IPublicTypeRemoteComponentDescription extends IPublicTypeComponentMetadata {
+
   /**
    * 组件描述导出名字，可以通过 window[exportName] 获取到组件描述的 Object 内容；
    */
   exportName?: string;
+
   /**
    * 组件描述的资源链接；
    */
-  url?: string;
+  url?: Asset;
+
   /**
    * 组件 (库) 的 npm 信息；
    */

packages/utils/src/asset.ts

@@ -214,6 +214,8 @@ function parseAsset(scripts: any, styles: any, asset: Asset | undefined | null,
 }
 
 export class AssetLoader {
+  private stylePoints = new Map<string, StylePoint>();
+
   async load(asset: Asset) {
     const styles: any = {};
     const scripts: any = {};
@@ -237,11 +239,9 @@ export class AssetLoader {
     await Promise.all(
       styleQueue.map(({ content, level, type, id }) => this.loadStyle(content, level!, type === AssetType.CSSUrl, id)),
     );
-    await Promise.all(scriptQueue.map(({ content, type }) => this.loadScript(content, type === AssetType.JSUrl)));
+    await Promise.all(scriptQueue.map(({ content, type, scriptType }) => this.loadScript(content, type === AssetType.JSUrl, scriptType)));
   }
 
-  private stylePoints = new Map<string, StylePoint>();
-
   private loadStyle(content: string | undefined | null, level: AssetLevel, isUrl?: boolean, id?: string) {
     if (!content) {
       return;
@@ -259,11 +259,11 @@ export class AssetLoader {
     return isUrl ? point.applyUrl(content) : point.applyText(content);
   }
 
-  private loadScript(content: string | undefined | null, isUrl?: boolean) {
+  private loadScript(content: string | undefined | null, isUrl?: boolean, scriptType?: string) {
     if (!content) {
       return;
     }
-    return isUrl ? load(content) : evaluate(content);
+    return isUrl ? load(content, scriptType) : evaluate(content, scriptType);
   }
 
   // todo 补充类型

packages/utils/src/script.ts

@@ -1,14 +1,15 @@
 import { createDefer } from './create-defer';
 
-export function evaluate(script: string) {
+export function evaluate(script: string, scriptType?: string) {
   const scriptEl = document.createElement('script');
+  scriptType && (scriptEl.type = scriptType);
   scriptEl.text = script;
   document.head.appendChild(scriptEl);
   document.head.removeChild(scriptEl);
 }
 
-export function load(url: string) {
-  const node: any = document.createElement('script');
+export function load(url: string, scriptType?: string) {
+  const node = document.createElement('script');
 
   // node.setAttribute('crossorigin', 'anonymous');
 
@@ -34,6 +35,8 @@ export function load(url: string) {
   // `async=false` is required to make sure all js resources execute sequentially.
   node.async = false;
 
+  scriptType && (node.type = scriptType);
+
   document.head.appendChild(node);
 
   return i.promise();