chore: downgrade template code to es5 (#2298)

2heal1 · web-flow · commit e0acf833ec8f · 2024-04-15T16:56:49.000+08:00
diff --git a/.changeset/khaki-apricots-turn.md b/.changeset/khaki-apricots-turn.md
@@ -0,0 +1,5 @@
+---
+'@module-federation/enhanced': patch
+---
+
+chore: downgrade template code to es5
diff --git a/apps/manifest-demo/3008-webpack-host/tsconfig.app.json b/apps/manifest-demo/3008-webpack-host/tsconfig.app.json
@@ -21,7 +21,8 @@
     "**/*.spec.js",
     "**/*.test.js",
     "**/*.spec.jsx",
-    "**/*.test.jsx"
+    "**/*.test.jsx",
+    "dist/**"
   ],
   "include": ["**/*.js", "**/*.jsx", "**/*.ts", "**/*.tsx"]
 }
diff --git a/apps/manifest-demo/3008-webpack-host/webpack.config.js b/apps/manifest-demo/3008-webpack-host/webpack.config.js
@@ -8,6 +8,9 @@ const { composePlugins, withNx } = require('@nx/webpack');
 const { withReact } = require('@nx/react');
 
 module.exports = composePlugins(withNx(), withReact(), (config, context) => {
+  config.watchOptions = {
+    ignored: ['**/node_modules/**', '**/@mf-types/**'],
+  };
   config.plugins.push(
     new ModuleFederationPlugin({
       name: 'manifest_host',
diff --git a/apps/manifest-demo/3009-webpack-provider/tsconfig.app.json b/apps/manifest-demo/3009-webpack-provider/tsconfig.app.json
@@ -21,7 +21,8 @@
     "**/*.spec.js",
     "**/*.test.js",
     "**/*.spec.jsx",
-    "**/*.test.jsx"
+    "**/*.test.jsx",
+    "dist/**"
   ],
   "include": ["**/*.js", "**/*.jsx", "**/*.ts", "**/*.tsx"]
 }
diff --git a/apps/manifest-demo/3009-webpack-provider/webpack.config.js b/apps/manifest-demo/3009-webpack-provider/webpack.config.js
@@ -12,6 +12,9 @@ module.exports = composePlugins(
   withNx(),
   withReact(),
   async (config, context) => {
+    config.watchOptions = {
+      ignored: ['**/node_modules/**', '**/@mf-types/**'],
+    };
     // publicPath must be specific url
     config.output.publicPath = 'http://localhost:3009/';
     config.plugins.push(
diff --git a/apps/manifest-demo/3010-rspack-provider/rspack.config.js b/apps/manifest-demo/3010-rspack-provider/rspack.config.js
@@ -13,6 +13,9 @@ module.exports = composePlugins(
   withNx(),
   withReact(),
   async (config, context) => {
+    config.watchOptions = {
+      ignored: ['**/node_modules/**', '**/@mf-types/**'],
+    };
     config.context = path.join(
       context.context.root,
       'apps/manifest-demo/3010-rspack-provider',
diff --git a/apps/manifest-demo/3010-rspack-provider/tsconfig.app.json b/apps/manifest-demo/3010-rspack-provider/tsconfig.app.json
@@ -21,7 +21,8 @@
     "**/*.spec.js",
     "**/*.test.js",
     "**/*.spec.jsx",
-    "**/*.test.jsx"
+    "**/*.test.jsx",
+    "dist/**"
   ],
   "include": ["**/*.js", "**/*.jsx", "**/*.ts", "**/*.tsx"]
 }
diff --git a/apps/manifest-demo/3011-rspack-manifest-provider/rspack.config.js b/apps/manifest-demo/3011-rspack-manifest-provider/rspack.config.js
@@ -13,6 +13,9 @@ module.exports = composePlugins(
   withNx(),
   withReact(),
   async (config, context) => {
+    config.watchOptions = {
+      ignored: ['**/node_modules/**', '**/@mf-types/**'],
+    };
     config.context = path.join(
       context.context.root,
       'apps/manifest-demo/3011-rspack-manifest-provider',
diff --git a/apps/manifest-demo/3011-rspack-manifest-provider/tsconfig.app.json b/apps/manifest-demo/3011-rspack-manifest-provider/tsconfig.app.json
@@ -21,7 +21,8 @@
     "**/*.spec.js",
     "**/*.test.js",
     "**/*.spec.jsx",
-    "**/*.test.jsx"
+    "**/*.test.jsx",
+    "dist/**"
   ],
   "include": ["**/*.js", "**/*.jsx", "**/*.ts", "**/*.tsx"]
 }
diff --git a/apps/manifest-demo/3012-rspack-js-entry-provider/rspack.config.js b/apps/manifest-demo/3012-rspack-js-entry-provider/rspack.config.js
@@ -13,6 +13,9 @@ module.exports = composePlugins(
   withNx(),
   withReact(),
   async (config, context) => {
+    config.watchOptions = {
+      ignored: ['**/node_modules/**', '**/@mf-types/**'],
+    };
     config.context = path.join(
       context.context.root,
       'apps/manifest-demo/3012-rspack-js-entry-provider',
diff --git a/apps/manifest-demo/3012-rspack-js-entry-provider/tsconfig.app.json b/apps/manifest-demo/3012-rspack-js-entry-provider/tsconfig.app.json
@@ -21,7 +21,8 @@
     "**/*.spec.js",
     "**/*.test.js",
     "**/*.spec.jsx",
-    "**/*.test.jsx"
+    "**/*.test.jsx",
+    "dist/**"
   ],
   "include": ["**/*.js", "**/*.jsx", "**/*.ts", "**/*.tsx"]
 }
diff --git a/apps/modernjs/.browserslistrc b/apps/modernjs/.browserslistrc
@@ -1,5 +1,5 @@
-chrome >= 51
-edge >= 15
-firefox >= 54
-safari >= 10
-ios_saf >= 10
+iOS >= 9
+Android >= 4.4
+last 2 versions
+> 0.2%
+not dead
diff --git a/apps/modernjs/modern.config.ts b/apps/modernjs/modern.config.ts
@@ -11,11 +11,24 @@ export default defineConfig({
   runtime: {
     router: true,
   },
+  security: {
+    checkSyntax: true,
+  },
+  source: {
+    // downgrade @module-federation related pkgs
+    include: [
+      // should set module-federation in outer repo
+      /universe\/packages/,
+    ],
+  },
   // source: {
   //   enableAsyncEntry: true,
   // },
   plugins: [appTools()],
   tools: {
+    babel(config) {
+      config.sourceType = 'unambiguous';
+    },
     webpack: (config, { webpack, appendPlugins }) => {
       if (config?.output) {
         config.output.publicPath = 'http://localhost:4001/';
diff --git a/apps/modernjs/package.json b/apps/modernjs/package.json
@@ -28,7 +28,8 @@
     "@modern-js/runtime": "2.46.1",
     "react": "~18.2.0",
     "react-dom": "~18.2.0",
-    "@module-federation/enhanced": "workspace:*"
+    "@module-federation/enhanced": "workspace:*",
+    "@babel/runtime": "7.24.4"
   },
   "devDependencies": {
     "@modern-js/app-tools": "2.46.1",
diff --git a/packages/enhanced/project.json b/packages/enhanced/project.json
@@ -41,7 +41,7 @@
         "parallel": false,
         "commands": [
           {
-            "command": "node -e \"require('child_process').execSync('node --expose-gc --max-old-space-size=4096 --experimental-vm-modules --trace-deprecation ' + require.resolve('jest-cli/bin/jest') + ' --logHeapUsage --config packages/enhanced/jest.config.ts')\"",
+            "command": "node packages/enhanced/test/script.js",
             "forwardAllArgs": false
           }
         ]
diff --git a/packages/enhanced/src/lib/container/runtime/FederationRuntimePlugin.ts b/packages/enhanced/src/lib/container/runtime/FederationRuntimePlugin.ts
@@ -72,7 +72,14 @@ class FederationRuntimePlugin {
     return Template.asString([
       `import federation from '${normalizedBundlerRuntimePath}';`,
       runtimePluginTemplates,
-      `${federationGlobal} = {...federation,...${federationGlobal}};`,
+      `var prevFederation = ${federationGlobal};`,
+      `${federationGlobal} = {}`,
+      `for(var key in federation){`,
+      Template.indent([`${federationGlobal}[key] = federation[key];`]),
+      '}',
+      `for(var key in prevFederation){`,
+      Template.indent([`${federationGlobal}[key] = prevFederation[key];`]),
+      '}',
       `if(!${federationGlobal}.instance){`,
       Template.indent([
         runtimePLuginNames.length
diff --git a/packages/enhanced/src/lib/sharing/ConsumeSharedRuntimeModule.ts b/packages/enhanced/src/lib/sharing/ConsumeSharedRuntimeModule.ts
@@ -135,7 +135,19 @@ class ConsumeSharedRuntimeModule extends RuntimeModule {
       initialConsumes.length > 0
         ? Template.asString([
             `var initialConsumes = ${JSON.stringify(initialConsumes)};`,
-            `${federationGlobal}.installInitialConsumes= ()=>${federationGlobal}.bundlerRuntime.installInitialConsumes({initialConsumes, installedModules, moduleToHandlerMapping, webpackRequire:${RuntimeGlobals.require}});`,
+            `${federationGlobal}.installInitialConsumes = ${runtimeTemplate.returningFunction(
+              Template.asString([
+                `${federationGlobal}.bundlerRuntime.installInitialConsumes({`,
+                Template.indent([
+                  'initialConsumes: initialConsumes,',
+                  'installedModules:installedModules,',
+                  'moduleToHandlerMapping:moduleToHandlerMapping,',
+                  `webpackRequire: ${RuntimeGlobals.require}`,
+                ]),
+                `})`,
+              ]),
+              '',
+            )}`,
           ])
         : '// no consumes in initial chunks',
       this._runtimeRequirements.has(RuntimeGlobals.ensureChunkHandlers)
@@ -148,7 +160,14 @@ class ConsumeSharedRuntimeModule extends RuntimeModule {
             `${
               RuntimeGlobals.ensureChunkHandlers
             }.consumes = ${runtimeTemplate.basicFunction('chunkId, promises', [
-              `${federationGlobal}.bundlerRuntime.consumes({chunkMapping, installedModules, chunkId, moduleToHandlerMapping, promises, webpackRequire:${RuntimeGlobals.require}});`,
+              `${federationGlobal}.bundlerRuntime.consumes({`,
+              'chunkMapping: chunkMapping,',
+              'installedModules: installedModules,',
+              'chunkId: chunkId,',
+              'moduleToHandlerMapping: moduleToHandlerMapping,',
+              'promises: promises,',
+              `webpackRequire:${RuntimeGlobals.require}`,
+              '});',
             ])}`,
           ])
         : '// no chunk loading of consumes',
diff --git a/packages/enhanced/test/script.js b/packages/enhanced/test/script.js
@@ -0,0 +1,14 @@
+const { spawnSync } = require('child_process');
+const jestPath = require.resolve('jest-cli/bin/jest');
+const args = [
+  '--expose-gc',
+  '--max-old-space-size=4096',
+  '--experimental-vm-modules',
+  '--trace-deprecation',
+  jestPath,
+  '--logHeapUsage',
+  '--config',
+  'packages/enhanced/jest.config.ts',
+];
+
+spawnSync('node', args, { stdio: 'inherit' });
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml

-Original file line number
+Diff line change
@@ @@ -0,0 +1,5 @@ @@
 +---
 +'@module-federation/enhanced': patch
 +---
++
 +chore: downgrade template code to es5