From e3611dcf06a0a24b691fab00734ce4cecb501f25 Mon Sep 17 00:00:00 2001 From: keuby Date: Tue, 7 Nov 2023 17:20:13 +0800 Subject: [PATCH] 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 --- .../src/shell/type/remote-component-description.ts | 6 +++++- packages/utils/src/asset.ts | 10 +++++----- packages/utils/src/script.ts | 9 ++++++--- 3 files changed, 16 insertions(+), 9 deletions(-) diff --git a/packages/types/src/shell/type/remote-component-description.ts b/packages/types/src/shell/type/remote-component-description.ts index 7ba532439..233720365 100644 --- a/packages/types/src/shell/type/remote-component-description.ts +++ b/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 信息; */ diff --git a/packages/utils/src/asset.ts b/packages/utils/src/asset.ts index ad0522124..3400f965b 100644 --- a/packages/utils/src/asset.ts +++ b/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(); + 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(); - 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 补充类型 diff --git a/packages/utils/src/script.ts b/packages/utils/src/script.ts index 7c772f03f..25159b198 100644 --- a/packages/utils/src/script.ts +++ b/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();