4

i'm developing 2 angular project ( different repo ) started on port 4200:

project 1(host) routing

{
path: 'contact',
loadChildren: () =>
  loadRemoteModule({
    remoteEntry: 'http://localhost:3000/remoteEntry.js',
    remoteName: 'mfe1',
    exposedModule: './Module'
  })
    .then(m => m.ContactModule)
 }

project 2 (remote) webpack started on port 3000:

  name: "mfe1",
  filename: "remoteEntry.js",

  exposes: {
    './Module': './src/app/contact/contact.module.ts',
  }

the loading of remoteEntry.js works correctly, but then i got ERROR Error: Uncaught (in promise): ChunkLoadError: Loading chunk src_app_contact_contact_module_ts failed http://localhost:4200/src_app_contact_contact_module_ts.js

why the remoteEntry.js is loaded correctly on port 3000 but the module of 2nd project is loaded from port 4200 instead of http://localhost:3000/src_app_contact_contact_module_ts.js

Fearlezz
  • 51
  • 1
  • 3
  • Do you have webpack configs for both host and remote? Do you have a boot.ts that imports main.ts? Not enough info here I’m afraid. – MikeOne Nov 21 '21 at 16:48
  • yes, i have webpack.config.ts in both apps, and also main.ts configured with bootstrap – Fearlezz Nov 21 '21 at 17:06
  • Weird. Does your remote run correctly as a standalone application? – MikeOne Nov 21 '21 at 18:41
  • yes sure, it works as standalone! – Fearlezz Nov 21 '21 at 20:20
  • 1
    i solved the problem with -> publicPath: "auto", now i'm facing another kind of problem Uncaught SyntaxError: import.meta may only appear in a module problem in mfe1remoteEntry.js – Fearlezz Nov 21 '21 at 22:03
  • No idea? Never seen that issue. Did you setup everything manually? Maybe worth using Nx and their mfe schematics? – MikeOne Nov 21 '21 at 22:52
  • i setup everythings manually with module federation – Fearlezz Nov 22 '21 at 14:21
  • Not sure how I can help, unless you can share the repo so I can see it all? – MikeOne Nov 22 '21 at 17:38
  • Hi, @Fearlezz! Have you solved this problem already? I have the same issue with `publicPath: 'auto' ` and have no idea in which direction to go. Could you please give a hint if you have any?) – Aleksei Golubev Feb 03 '22 at 15:29
  • Hey, If you are migrating on angular 13, Check this out https://github.com/angular-architects/module-federation-plugin/blob/main/migration-guide.md – Muhammad Usman Feb 04 '22 at 06:22
  • the error import.meta may only appear in a module problem in mfe1remoteEntry.js is caused by the added style.js that is not a module. I dont know how to fix this either – Ron Jonk Apr 11 '22 at 06:44
  • Hello, @Fearlezz were you able to fix this issue ? i am also facing the same scenario now... – Prats May 23 '22 at 17:28

0 Answers0