feat: extract NodeTransformer type to shared package (#2808)

umijs · Nov 13, 2023 · f2af2e3 · f2af2e3
1 parent 5eab1b6
commit f2af2e3
Show file tree

Hide file tree

Showing 16 changed files with 72 additions and 60 deletions.
diff --git a/.changeset/wicked-icons-type.md b/.changeset/wicked-icons-type.md
@@ -0,0 +1,8 @@
+---
+"@qiankunjs/loader": patch
+"qiankun": patch
+"@qiankunjs/sandbox": patch
+"@qiankunjs/shared": patch
+---
+
+feat: extract NodeTransformer type to shared package
diff --git a/packages/loader/src/index.ts b/packages/loader/src/index.ts
@@ -1,7 +1,7 @@
 import type { Sandbox } from '@qiankunjs/sandbox';
 import { qiankunHeadTagName } from '@qiankunjs/sandbox';
-import type { BaseTranspilerOpts } from '@qiankunjs/shared';
-import { Deferred, moduleResolver as defaultModuleResolver, QiankunError, transpileAssets } from '@qiankunjs/shared';
+import type { BaseTranspilerOpts, NodeTransformer } from '@qiankunjs/shared';
+import { Deferred, QiankunError } from '@qiankunjs/shared';
 import { createTagTransformStream } from './TagTransformStream';
 import { isUrlHasOwnProtocol } from './utils';
 import WritableDOMStream from './writable-dom';
@@ -19,24 +19,16 @@ type Entry = HTMLEntry;
 //
 export type LoaderOpts = {
   streamTransformer?: () => TransformStream<string, string>;
-  nodeTransformer?: typeof transpileAssets;
-} & BaseTranspilerOpts & { sandbox?: Sandbox };
+  nodeTransformer?: NodeTransformer;
+} & Omit<BaseTranspilerOpts, 'moduleResolver'> & { sandbox?: Sandbox };
 
 /**
  * @param entry
  * @param container
  * @param opts
  */
 export async function loadEntry<T>(entry: Entry, container: HTMLElement, opts: LoaderOpts): Promise<T | void> {
-  const {
-    fetch,
-    nodeTransformer = transpileAssets,
-    streamTransformer,
-    sandbox,
-    moduleResolver = (url: string) => {
-      return defaultModuleResolver(url, container, document.head);
-    },
-  } = opts;
+  const { fetch, streamTransformer, sandbox, nodeTransformer } = opts;
 
   const res = isUrlHasOwnProtocol(entry) ? await fetch(entry) : new Response(entry, { status: 200, statusText: 'OK' });
   if (res.body) {
@@ -77,12 +69,13 @@ export async function loadEntry<T>(entry: Entry, container: HTMLElement, opts: L
       )
       .pipeTo(
         new WritableDOMStream(container, null, (clone, node) => {
-          const transformedNode = nodeTransformer(clone, entry, {
-            fetch,
-            sandbox,
-            moduleResolver,
-            rawNode: node as unknown as Node,
-          });
+          const transformedNode = nodeTransformer
+            ? nodeTransformer(clone, entry, {
+                fetch,
+                sandbox,
+                rawNode: node as unknown as Node,
+              })
+            : clone;
 
           const script = transformedNode as unknown as HTMLScriptElement;
 

diff --git a/packages/loader/tsconfig.json b/packages/loader/tsconfig.json
diff --git a/packages/qiankun/.fatherrc.js b/packages/qiankun/.fatherrc.js
@@ -8,6 +8,6 @@ const versionFilePath = join(__dirname, './src/version.ts');
 writeFileSync(versionFilePath, `export const version = '${version}';`);
 
 export default {
-  umd: {},
+  // umd: {},
   ...cfg,
 };
diff --git a/packages/qiankun/src/core/loadApp.ts b/packages/qiankun/src/core/loadApp.ts
@@ -6,7 +6,7 @@ import type { LoaderOpts } from '@qiankunjs/loader';
 import { loadEntry } from '@qiankunjs/loader';
 import type { Sandbox } from '@qiankunjs/sandbox';
 import { createSandboxContainer } from '@qiankunjs/sandbox';
-import { wrapFetchWithCache } from '@qiankunjs/shared';
+import { moduleResolver as defaultModuleResolver, transpileAssets, wrapFetchWithCache } from '@qiankunjs/shared';
 import { concat, isFunction, mergeWith } from 'lodash';
 import type { ParcelConfigObject } from 'single-spa';
 import getAddOns from '../addons';
@@ -29,7 +29,18 @@ export default async function loadApp<T extends ObjectType>(
   lifeCycles?: LifeCycles<T>,
 ): Promise<ParcelConfigObjectGetter> {
   const { name: appName, entry, container } = app;
-  const { fetch = window.fetch, sandbox, globalContext = window, ...restConfiguration } = configuration || {};
+  const defaultNodeTransformer: AppConfiguration['nodeTransformer'] = (node, baseURI, opts) => {
+    const moduleResolver = (url: string) => defaultModuleResolver(url, sandboxMicroAppContainer, document.head);
+    return transpileAssets(node, baseURI, { ...opts, moduleResolver });
+  };
+  const {
+    fetch = window.fetch,
+    sandbox,
+    globalContext = window,
+    nodeTransformer = defaultNodeTransformer,
+    ...restConfiguration
+  } = configuration || {};
+
   const fetchWithLruCache = wrapFetchWithCache(fetch);
 
   const markName = `[qiankun] App ${appName} Loading`;
@@ -50,7 +61,7 @@ export default async function loadApp<T extends ObjectType>(
       globalContext,
       extraGlobals: {},
       fetch: fetchWithLruCache,
-      nodeTransformer: restConfiguration.nodeTransformer,
+      nodeTransformer,
     });
 
     sandboxInstance = sandboxContainer.instance;
@@ -60,7 +71,12 @@ export default async function loadApp<T extends ObjectType>(
     unmountSandbox = () => sandboxContainer.unmount();
   }
 
-  const containerOpts: LoaderOpts = { fetch: fetchWithLruCache, sandbox: sandboxInstance, ...restConfiguration };
+  const containerOpts: LoaderOpts = {
+    fetch: fetchWithLruCache,
+    sandbox: sandboxInstance,
+    nodeTransformer,
+    ...restConfiguration,
+  };
 
   const lifecyclesPromise = loadEntry<MicroAppLifeCycles>(entry, sandboxMicroAppContainer, containerOpts);
 

diff --git a/packages/qiankun/tsconfig.json b/packages/qiankun/tsconfig.json
diff --git a/packages/sandbox/src/patchers/dynamicAppend/common.ts b/packages/sandbox/src/patchers/dynamicAppend/common.ts
@@ -159,13 +159,11 @@ export function getOverwrittenAppendChildOrInsertBefore(
           }
 
           const { sandbox, nodeTransformer, fetch } = sandboxConfig;
-          const transpiledStyleSheetElement = nodeTransformer
-            ? nodeTransformer(stylesheetElement, location.href, {
-                fetch,
-                sandbox,
-                rawNode: stylesheetElement,
-              })
-            : stylesheetElement;
+          const transpiledStyleSheetElement = nodeTransformer(stylesheetElement, location.href, {
+            fetch,
+            sandbox,
+            rawNode: stylesheetElement,
+          });
 
           const result = appendChild.call(this, transpiledStyleSheetElement, referenceNode);
 
@@ -200,15 +198,13 @@ export function getOverwrittenAppendChildOrInsertBefore(
             scriptTranspiledDeferred = new Deferred<void>();
           }
 
-          const transpiledScriptElement = nodeTransformer
-            ? nodeTransformer(scriptElement, location.href, {
-                fetch,
-                sandbox,
-                rawNode: scriptElement,
-                prevScriptTranspiledDeferred,
-                scriptTranspiledDeferred,
-              } as ScriptTranspilerOpts)
-            : scriptElement;
+          const transpiledScriptElement = nodeTransformer(scriptElement, location.href, {
+            fetch,
+            sandbox,
+            rawNode: scriptElement,
+            prevScriptTranspiledDeferred,
+            scriptTranspiledDeferred,
+          } as ScriptTranspilerOpts);
 
           const result = appendChild.call(this, transpiledScriptElement, refChild) as T;
 

diff --git a/packages/sandbox/src/patchers/dynamicAppend/types.ts b/packages/sandbox/src/patchers/dynamicAppend/types.ts
@@ -2,12 +2,13 @@
  * @author Kuitos
  * @since 2023-05-04
  */
-import type { BaseLoaderOpts, transpileAssets } from '@qiankunjs/shared';
+import type { BaseLoaderOpts, NodeTransformer } from '@qiankunjs/shared';
 import type { Sandbox } from '../../core/sandbox';
 
 export type SandboxConfig = {
   appName: string;
   sandbox: Sandbox;
   dynamicStyleSheetElements: Array<HTMLStyleElement | HTMLLinkElement>;
   dynamicExternalSyncScriptElements: HTMLScriptElement[];
-} & BaseLoaderOpts & { nodeTransformer?: typeof transpileAssets };
+  nodeTransformer: NodeTransformer;
+} & BaseLoaderOpts;
diff --git a/packages/sandbox/tsconfig.json b/packages/sandbox/tsconfig.json
diff --git a/packages/shared/src/assets-transpilers/types.ts b/packages/shared/src/assets-transpilers/types.ts
@@ -15,6 +15,12 @@ export type BaseTranspilerOpts = BaseLoaderOpts & {
 
 export type AssetsTranspilerOpts = BaseTranspilerOpts & { rawNode: Node };
 
+export type NodeTransformer = <T extends Node>(
+  node: T,
+  baseURI: string,
+  opts: Omit<AssetsTranspilerOpts, 'moduleResolver'>,
+) => T;
+
 export type ScriptTranspilerOpts = AssetsTranspilerOpts &
   (
     | { prevScriptTranspiledDeferred: Deferred<void>; scriptTranspiledDeferred: Deferred<void> }

diff --git a/packages/shared/tsconfig.json b/packages/shared/tsconfig.json
diff --git a/packages/ui-bindings/react/tsconfig.json b/packages/ui-bindings/react/tsconfig.json
@@ -1,6 +1,9 @@
 {
   "extends": "../../../tsconfig.json",
   "compilerOptions": {
-    "jsx": "react"
+    "jsx": "react",
+    "paths": {
+      "qiankun": ["packages/qiankun/src"]
+    }
   }
 }
diff --git a/packages/webpack-plugin/plugin.test.ts → packages/webpack-plugin/tests/plugin.test.ts b/packages/webpack-plugin/plugin.test.ts → packages/webpack-plugin/tests/plugin.test.ts
diff --git a/packages/webpack-plugin/tsconfig.json b/packages/webpack-plugin/tsconfig.json
diff --git a/tsconfig.eslint.json b/tsconfig.eslint.json
@@ -7,7 +7,9 @@
   },
   "include": [
     // whatever paths you intend to lint
-    "src",
+    "packages/*/src",
+    "packages/webpack-plugin/tests",
+    "packages/ui-bindings/*/src",
     "vitest.workspace.ts",
     "vitest.config.ts",
     ".fatherrc.js"

diff --git a/tsconfig.json b/tsconfig.json
@@ -1,5 +1,6 @@
 {
   "compilerOptions": {
+    "baseUrl": "./",
     "target": "esnext",
     "module": "esnext",
     "lib": ["es2018", "dom"],
@@ -24,7 +25,8 @@
     "esModuleInterop": true,
     "types": ["vitest/globals", "node"],
     "paths": {
-      "@@/*": ["./.dumi/tmp/*"]
+      "@@/*": ["./.dumi/tmp/*"],
+      "@qiankunjs/*": ["packages/*/src"]
     }
   },
   "exclude": ["node_modules", "examples", "packages/**/dist"]