I’m trying to integrate a React micro-frontend into Salesforce using Lightning Web Components (LWC) and Webpack Module Federation.
My goal is to dynamically load the remote React app (remoteEntry.js) from a local or external server, like this:
const remoteEntryUrl = 'https://localhost:8081/remoteEntry.js';
const script = document.createElement('script');
script.src = remoteEntryUrl;
script.type = 'text/javascript';
script.async = true;
script.crossOrigin = 'anonymous';
script.onload = () => console.log('✅ loaded');
script.onerror = (err) => console.error(err);
document.head.appendChild(script);
The script appears in the Network tab and downloads successfully, but in LWC, onload or onerror is never triggered.
My constraints:
I can’t use Aura components.
I can’t use iframes.
I don’t want to upload the React build as a static resource.
I want to dynamically fetch remoteEntry.js and load the remote React app (Module Federation container).
What I’ve tried:
Using loadScript() from lightning/platformResourceLoader — works, but only for static resources.
Using fetch() to retrieve JS content — but can’t execute due to Locker Service restrictions.
Web Workers — but no DOM access to mount React.
Question: Is there any supported way to load and execute an external remoteEntry.js (Webpack Module Federation) dynamically inside an LWC (without Aura or iframe)? Or is this completely blocked by Lightning Web Security?
Any workaround or official confirmation from Salesforce documentation would help.
module-federation, webpack