Questions tagged [webpack-module-federation]
The webpack-module-federation tag has no usage guidance.
webpack-module-federation
589
questions
0
votes
0
answers
6
views
Use hash in remote module URL for webpack module federated components
I have a app that loads some module federated components. For example:
module.exports = {
plugins: [
new ModuleFederationPlugin({
name: 'app',
remotes: {
remoteComponent1:'...
- 355
0
votes
0
answers
17
views
Unable to invoke a dialog component via MFE
I need to load a remote module for an angular based app. The remote module is also angular based and part of another FE. Here is the code I'm using:
loadRemoteModule({
remoteEntry: 'https://...
- 531
0
votes
0
answers
24
views
Module federation: Unsatisfied version 18.3.1 from `REMOTE-REPO-C` of shared singleton module react (required ^17.0.1)
I am using module federation for micro-frontends, where the host is react:^17 and some of the remote repos also have react:^17.
I want to upgrade all the repos to ^18 in a step by step manner with one ...
- 266
0
votes
0
answers
26
views
Module Federation not workng with react host app and vite-react remote app
I have setup the module federation using two remote apps into one host application. My host app is react and one the remote is also created using react, while the second remote app is created using ...
1
vote
0
answers
17
views
How to bootstrap the routing, NgRx etc of MFE module from the shell project forcibly using module federation?
I want to bootstrap or initiate the MFE's routing, NgRx and other library instances from the Shell project programatically.
Now I am doing lazy load of modules from shell as below
loadChildren: () =&...
- 7,380
0
votes
0
answers
37
views
How to extract a component from dynamically loaded angular remote module
How to extract the Component from module federation remote module
At present I am having the below code
Remote code:
exposes: {
'./TodoModule': './src/todo/todo.module.ts',
'./...
- 7,380
1
vote
0
answers
48
views
Utilize react component over URLs dyanamically
I have a React component say TEST.TSX , I have compiled the .tsx file to .js and uploaded it to GitHub, so that I can server it over JsDelivr. Can I use the CDN in another react app to utilize the ...
0
votes
0
answers
16
views
Angular microfront end w/ tailwindcss
i use module federation and multirepo in angular, i have a shell, an app (MFE) and a shared-ui
so in my shared-ui i have installed tailwindcss, i have my file tailwind.config.js and a styles.scss ...
- 1
0
votes
0
answers
25
views
Error when switching between Angular micro frontends in a project using Module Federation
I am facing an issue with my microfrontend architecture project where I use Module Federation. My project structure is:
Shell (React)
Microfrontend 1 (Next.js)
Microfrontend 2 (Angular)
Microfrontend ...
- 1
0
votes
0
answers
29
views
Module not found: Error: Can't resolve 'provider_app/App' remote React modules
I'm trying to access React components from a consumer in a remote link. I'm using Module federation in Webpack 5 for this. Here's my code.
Provider App
App.js
import React from 'react'
function App() ...
- 1
0
votes
0
answers
34
views
How to expose a React component from host application to a module federated child application in Micro Front End Architecture?
I was exploring the Microfront End Architecture, and I found this very useful github repo https://github.com/nebarf/module-federation-react-router-dom
My usecase is I want to expose a component from ...
0
votes
1
answer
123
views
Css variables of Primevue styles are not defined in module federation layout app
I try to use feature of customization of the primevue theme and change the prefix for css variables of Primevue style. After checking the changes in layout MF app I unfortunately see that all this ...
0
votes
0
answers
40
views
Use TraslateService in standalone components accross Angular microfrontends and Webpack Module Federation
Which is the best way to use the TraslateService (ngx-translate) accross microfrontends in an Angualar application with Webpack Module Federation using standalone components?
I was importing ...
- 335
0
votes
0
answers
21
views
Shared dependencies are still generated in both remote and shell app in @angular-architects/module-federation
Both shell app and remote app has angular_core package in the build bundle, even after adding them in shared: {} webpack config. Is it expected?
Shell app webpack config
'@angular/core': {
...
0
votes
0
answers
23
views
Micro frontend - Material UI library duplicate imports webpack
I am implementing the microfrontend architecture, My main app and mf1 app uses material ui,
the material ui library are imported multiple times, even after specifying the singleton property.
which is ...
0
votes
1
answer
32
views
Cannot load multiple modules and components from an Angular microapp
I'm trying to load an Angular remote component in another shell application, but I get:
TypeError: Cannot read properties of undefined (reading 'get') and TypeError: Cannot read properties of ...
- 98
0
votes
1
answer
63
views
Uncaught Error: Shared module is not available for eager consumption in Module Federation with React and Storybook
I'm using Module Federation with React and Storybook and encountering an issue. The page loads correctly initially, but upon refresh, I receive the following error:
Error Image Preview
Input.jsx:
...
- 3
0
votes
0
answers
46
views
Getting Error when routing to remote module nested component from shell in angular 17 micro frontend using module federation
im using module federation for angular micro front end with angular V17 projects. im exposing routes from remote module.
for initial routing it is working good, but i have 2 buttons in remote module ...
- 19
0
votes
0
answers
53
views
Angular Module federation - how to import and use a shared module from another mf-project
I am using module federation for microfrontends, and in each microfrontend I use atomic architecture. I have a module called atoms that contains and exports many components. I want to use these ...
1
vote
0
answers
24
views
Webpack: Module "./..." does not exist in container after deploying to AWS
I have a React micro frontend application using Webpack's Module Federation and I am not able to figure out this error after I deploy the MFEs up to a higher environment in AWS. The apps run fine if I ...
- 31
0
votes
1
answer
36
views
Material-Table is not displayed in the host React app
I'm trying to implementing Module Federation for my web app. I'm using React Vite. I tried to call <IdentificationCard /> component inside remote app from host app but it didn't showed up.
I use ...
- 19
1
vote
1
answer
158
views
Load remote React component in runtime
I could not find an good enough answer so I'm creating a new question with the details of what I'm trying to archive.
I have a React Component that will be embedded in other pages.
This React ...
- 1,474
0
votes
0
answers
30
views
Angular Modular Federation with base-href for remote module in shell
I've 2 remote apps app1and app2 and a shell app myapp, since all the applications will be behind a proxy, each app is distinguished by base-href i.e, /app1,/app2 and /myapp respectively. From app1 ...
- 9,924
0
votes
0
answers
37
views
remote application child route not working - Angular
in microfrontend - i am exposing one module suppose m1 and this m1 have 5 route it's working fine while i am running this child application individually but after integrate as microsite in shell ...
1
vote
0
answers
60
views
TypeError: dispatcher is null
I'm having some issues, but the main one seems to be the TypeError: dispatcher is null. It appears after several rebuilds of the code. Additionally, in the browser console, I see the warning: Invalid ...
0
votes
0
answers
67
views
NX Module Federation: ng-zorro-antd library not shared between host and remote apps
I am working on an NX monorepo setup with Module Federation, and I'm facing an issue with sharing the ng-zorro-antd library between my host and remote applications. Despite configuring the library as ...
- 23
1
vote
0
answers
74
views
Use Vite as remote app in Webpack 5 dynamic remotes container
I'm trying to migrate my remote app from Webpack 5 to Vite.js and I am stuck at loading dynamically remotes by the host that works with Webpack 5.
The remote app exposes an entry point file with Vite ...
- 31
0
votes
0
answers
52
views
how can I achieve css isolation in my module federation app?
I have React module federation app.
I load several remote components, which are being developed by other development teams in the company.
lately, we've ran into an issue where the css of the remote ...
- 31
0
votes
0
answers
30
views
I frame or module federation is more preferable to setup different applications in one portal through NEXTJS14
I have different small relates application developed by different languages and I want to collect through one portal. I used Nextjs 14 as a host so which one prefer Module Federation, or I frame ...
- 1
0
votes
0
answers
42
views
Module Federation: Remote app crashes the host app
So I have a remote app that is being consumed in the host app. I'm importing the Button component from the remote and lazy loading in the host app. The problem is that the remote app crashes the host ...
