feat(runtime): add loadEntry hook
#2826
Conversation
🦋 Changeset detectedLatest commit: 8240346 The changes in this PR will be included in the next version bump. This PR includes changesets to release 35 packages
Not sure what this means? Click here to learn what changesets are. Click here if you're a maintainer who wants to add another changeset to this PR |
✅ Deploy Preview for module-federation-docs ready!
To edit notification comments on pull requests, go to your Netlify site configuration. |
|
@2heal1 looking forward to hearing your thoughts on this implementation. I feel like with the current parameters of |
|
@squadronai review |
![squadronai[bot]](https://avatars.githubusercontent.com/in/901096?s=60&v=4){kind=small}
There was a problem hiding this comment.
Summary
This pull request introduces a new loadEntry loader hook and implements runtime plugins for DOM and Node environments. The core changes include:
- Added the
loadEntryloader hook to handle loading entries in different environments. - Implemented
domandnoderuntime plugins that utilize theloadEntryhook. - Introduced new functions for loading remote entries in DOM and Node.js environments, supporting various module types (ESM, SystemJS, script-based).
- Implemented preloading functionality for CSS and JavaScript assets.
- Improved error handling for remote entry initialization.
These changes aim to enhance the overall functionality and flexibility of the Module Federation runtime, allowing for better integration with different environments and module types.
| File | Summary |
|---|---|
| packages/runtime/src/core.ts | The code introduces a new loadEntry loader hook and implements runtime plugins for DOM and Node environments. It sets up default options for the Federation Host, including plugins for snapshot and preload asset generation, and initializes various handlers for snapshots, shared modules, and remotes. |
| packages/runtime/src/plugins/dom/index.ts | The code introduces a domPlugin function that returns a FederationRuntimePlugin. It implements a loadEntry method, which utilizes the loadEntryDom function to handle loading entries in a DOM environment, supporting different module types. |
| packages/runtime/src/plugins/dom/loadEntry.ts | undefined |
| packages/runtime/src/plugins/node/index.ts | The code introduces a nodePlugin function that returns a FederationRuntimePlugin. It implements a loadEntry method using the loadEntryNode function, passing necessary parameters including a createScriptHook callback. |
| packages/runtime/src/plugins/node/loadEntry.ts | The code introduces two functions for loading remote entry scripts in a Node.js environment. 'loadEntryScript' handles the core logic of loading and validating remote entry exports, while 'loadEntryNode' serves as a wrapper function with a simplified interface. |
| packages/runtime/src/utils/load.ts | The code introduces new functions for loading remote entries in different environments. It adds support for ESM, SystemJS, and script-based entry loading, with separate implementations for DOM and Node environments. |
| packages/runtime/src/utils/preload.ts | The code implements preloading functionality for CSS and JavaScript assets. It creates link elements for CSS and script elements for JavaScript, with different attributes based on the useLinkPreload flag. The code also utilizes lifecycle hooks for creating these elements. |
| packages/runtime/src/module/index.ts | The code implements error handling for remote entry initialization. It checks if the 'init' function exists in the remote entry exports and logs an error message if it's undefined. Then, it proceeds to initialize the remote entry with provided options. |
| packages/sdk/src/dom.ts | The code introduces a DOM-specific implementation for loading remote entries. It creates a script element, sets its attributes, and applies a custom hook for script creation if provided. |
Commits reviewed:
72bcb40fac84fd62762850cb7a277b2afddc8efa...dafedb2cee3abc765217def871874dc3529ca84b
72bcb40fac84fd62762850cb7a277b2afddc8efa...ab4bfbd66e0a4264050e3f4a7aeaed1617ebf303
ab4bfbd66e0a4264050e3f4a7aeaed1617ebf303...82403465599a230d1ccb9eeb941736824aa6758b
ab4bfbd66e0a4264050e3f4a7aeaed1617ebf303...82403465599a230d1ccb9eeb941736824aa6758b
ab4bfbd66e0a4264050e3f4a7aeaed1617ebf303...82403465599a230d1ccb9eeb941736824aa6758b
72bcb40fac84fd62762850cb7a277b2afddc8efa...82403465599a230d1ccb9eeb941736824aa6758b
72bcb40fac84fd62762850cb7a277b2afddc8efa...82403465599a230d1ccb9eeb941736824aa6758b
72bcb40fac84fd62762850cb7a277b2afddc8efa...82403465599a230d1ccb9eeb941736824aa6758b
Issues Reviewed:
| Issue | Result | Reason |
|---|---|---|
| 2811 | ✅ | The pull request addresses the issue of supporting Module Federation V2 in the React-Native environment, which is described in the provided issue information. |
Yes i agree , |
|
thanks your contribution , i have finished review . And it needs something to modify |
|
added fixes after review, skipped most of squadronAI stuff since it didn't seem useful - if you want me to address some of these automated checks then I can do this no problem |
|
Here is still a question, don't forget to handle ~ |
…odule-federation-core into refactor/split-get-remote-entry
|
I've resolved the issue in question, please check whether its ok, thanks! |
|
Yes , no big issues , just still a small issues need to handle . And you need to merge/rebase newest branch , and fix the CI |
|
I've addressed the issues you've mentioned and added changeset, let me know if there is anything else to be done here 🫡 |
|
Thanks for your contribution ! Merged! |
|
Is there a demo of loaderEntry hook? |
|
@zhangHongEn you can take a look at PR here that utilises it: |
|
Thanks, awesome, that's what I was looking for. #2905 |
|
@jbroma |
|
You can review here |
Description
loadEntryloader hook that handles loading entry in different environmentsdomandnoderuntime plugins that useloadEntryhookchange suggested here: #2812 (comment)
Related Issue
#2811
Types of changes
Checklist