Merge d555922 into 0285f5f

Author: ScriptedAlchemy

apps/bundle-size/src/bootstrap.tsx

@@ -1,3 +1,19 @@
+import React, { StrictMode } from 'react';
 import { init } from '@module-federation/enhanced/runtime';
+import * as ReactDOM from 'react-dom/client';
+import HelloWorld from './HelloWorld';
 
-require('./bootstrap');
+init({
+  name: 'bundle_size',
+  remotes: [], // No remote references needed
+});
+
+const rootElement = document.getElementById('root');
+if (!rootElement) {
+  throw new Error('Failed to find the root element');
+}
+
+const root = ReactDOM.createRoot(rootElement);
+root.render(
+  React.createElement(StrictMode, null, React.createElement(HelloWorld)),
+);

apps/bundle-size/src/index.ts

@@ -5,6 +5,9 @@ const {
 
 module.exports = withFederation({
   name: 'mfe1',
+  experiments: {
+    asyncStartup: true,
+  },
   filename: './mfe1/remoteEntry.js',
   exposes: {
     './component': './mfe1/app',

apps/esbuild/mfe1/bootstrap.tsx

@@ -1,3 +1,8 @@
-(async () => {
-  await import('./bootstrap');
-})();
+import React from 'react';
+import ReactDOM from 'react-dom';
+import { App } from './app';
+
+ReactDOM.render(
+  React.createElement(React.StrictMode, null, React.createElement(App, null)),
+  document.getElementById('root'),
+);

apps/esbuild/mfe1/federation.config.js

@@ -7,6 +7,9 @@ const {
 
 module.exports = withFederation({
   name: 'host',
+  experiments: {
+    asyncStartup: true,
+  },
   filename: './shell/remoteEntry.js',
   remotes: {
     mfe1: 'http://localhost:3001/remoteEntry.js',

apps/esbuild/mfe1/main.ts

@@ -1,5 +1,14 @@
 //@ts-nocheck
 
-(async () => {
-  import('./bootstrap');
-})();
+import React from 'react';
+import ReactDOM from 'react-dom';
+import { App } from './app';
+
+import { of } from 'rxjs';
+
+console.log(of);
+
+ReactDOM.render(
+  React.createElement(React.StrictMode, null, React.createElement(App, null)),
+  document.getElementById('root'),
+);

apps/esbuild/shell/bootstrap.tsx

@@ -1 +1,12 @@
-import('./bootstrap');
+import React, { StrictMode } from 'react';
+import * as ReactDOM from 'react-dom/client';
+
+import App from './App';
+
+const rootElement = document.getElementById('root');
+if (!rootElement) {
+  throw new Error('Failed to find the root element');
+}
+
+const root = ReactDOM.createRoot(rootElement);
+root.render(React.createElement(StrictMode, null, React.createElement(App)));