-
-
Notifications
You must be signed in to change notification settings - Fork 1.7k
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
[Question] What's the best practices of shared dependencies? #2219
Comments
Sharing should be done with care - since shared modules cannot be tree shaken. If you need a singleton (like things that depend on react context), then it must be shared. Sharing all dependencies can lead to larger bundles so its best to consider case by case. Example: If I share |
We are facing the same problem trying to use module federation in real world. Before module federation, in the extremely complicated app we have, Because of that, those Our performance tab shows In order to render the first content that visible to user (apart from ssr),
My questions are:
|
ESM has not been a problem for me, automatic federation plugin is very out of date and does not cater for package exports resolution putting a trailing slash on end of package helps ensure it deal with dynamic exports like package.json exports field. MFP works with ESM targets too if you had a esm output set and i use esm npm packages be default without any issues as of yet Redux is context based, should be singleton, translations likely the same and needs to be singleton too Corejs, id share since everyone would need those and probbably the same ones over and over so sharing it is a good idea
|
Just to be clear,
the correct way to do this is? const deps = require('./package.json').dependencies;
...
shared: {
'core-js/': {
requiredVersion: deps.core-js,
},
'lodash-es/': {
requiredVersion: deps.lodash-es,
},
'@reduxjs/toolkit': {
singleton: true,
},
'react-dom': {
singleton: true,
},
react: {
singleton: true,
},
i18next: {
singleton: true,
},
'@mui/material/': {
requiredVersion: deps.@mui/material,
}
},
|
Consider booking a call. This is tricky to document. Free of charge. Easier to talk than write. |
Thank for your valuable time, I just booked a meeting in calendly. Please feel free to reschedule the meeting at your convenience @ScriptedAlchemy |
Thank you! @ScriptedAlchemy Would love to see the meeting record, anywhere I can watch it? 👀 |
Didn't record. But should have. Dm me happy to do another. |
Sharing all dependencies from IllustrationBelow is an illustration of the environment and the issue I've encountered:
shared: {
...packageJson.dependencies,
//
// "@my-component/container": "^2.0.0",
// "@my-component/item": "^1.0.0"
}
import Container from "@my-component/container";
import Item from "@my-component/item";
export default () => (
<>
<Container />
<Item />
</>
)
Notice in the "current" scenario, Apprently, base on the quote from sokra, this is not recommended:
. My thoughtAs many readers will refer to the examples here, I would think it is best to replace all examples showing: const deps = require('../package.json').dependencies;
module.exports = {
shared: {
...deps,
react: {
singleton: true,
requiredVersion: deps.react,
},
'react-dom': {
singleton: true,
requiredVersion: deps['react-dom']
}
}
} to something like this?: const deps = require('../package.json').dependencies;
module.exports = {
shared: [
...Object.keys(deps),
{
react: {
singleton: true,
requiredVersion: deps.react,
},
'react-dom': {
singleton: true,
requiredVersion: deps['react-dom']
}
}
]
} |
Hi @amoshydra, I am experiencing the same issue. Have you managed to solve it? |
any update regarding this issue? |
This seems will end up with too many chunks, feels a bit overwhelming as it leads to a lot more requests.
singleton
and those large dependenciesThen we would need to carefully sync the required versions so that each federated module compatible with each other
singleton
I understand it is different case by case, but would be nice to see what other people think 😃
The text was updated successfully, but these errors were encountered: