search

angular-architects / module-federation-plugin

MIT License
718 stars 194 forks source link

Unable to resolve module-federation:boot-async #186

Open richajain1785 opened 2 years ago

richajain1785 commented 2 years ago

I am trying to add angular material module to my Nx workspace project.

I referred manfred's recommendations to turn off bootstrapping before adding angular material and then turn it on. This was working around a month back when I tried earlier. But running the bootstrap command now returns below error:

nx g @angular-architects/module-federation:boot-async false --project myapp

Unable to resolve @angular-architects/module-federation:boot-async.
PropertyNameExpected in <mypath>/node_modules/@angular-architects/module-federation/collection.json at position 376

I am on Nx workspace 14.1.5. and "@angular-architects/module-federation": "^14.3.3"

@manfredsteyer Please help with the solution.

dkhrunov commented 2 years ago

Hello, try to make this manually, I mean, do bootstrap the app synchronously, like in the common angular app

wgbnyes commented 2 years ago

I have the same problem. I have an Nx MFE workspace and when trying to add @angularuniversal I get several errors.

As described by @manfredsteyer, I should temporarily disable the module-federation asynchronous boot, but the command for that also gives me errors and I don't know how to solve them.

$ npx nx g @angular-architects/module-federation:boot-async false --project rewards          
NX  Generating @angular-architects/module-federation:boot-async
TypeError: Cannot convert undefined or null to object

It's very frustrating, because an MFE workspace doesn't work with most of the stuff provided by Nx, and in that sense it should never have been advanced with this solution if we just couldn't use it.

This is my workspace configuration, where yes4web-bootstrap is the host and the other projects are the remote ones.

{
  "$schema": "./node_modules/nx/schemas/workspace-schema.json",
  "version": 2,
  "projects": {
    "admin": "apps/admin",
    "admin-e2e": "apps/admin-e2e",
    "motivation": "apps/motivation",
    "motivation-e2e": "apps/motivation-e2e",
    "rewards": "apps/rewards",
    "rewards-e2e": "apps/rewards-e2e",
    "sales": "apps/sales",
    "sales-e2e": "apps/sales-e2e",
    "yes4web-bootstrap": "apps/yes4web-bootstrap",
    "yes4web-bootstrap-e2e": "apps/yes4web-bootstrap-e2e"
  }
}
gatoenano commented 1 year ago

@manfredsteyer solution doesn't seem to work anymore.

In order to install Angular Material you have to do it manually following the @Coly010 instructions here and here.

In short, go to the "project.json" file and change the following: . within "build":

That's it!

ggros-septeo commented 1 year ago

@manfredsteyer solution doesn't seem to work anymore.

In order to install Angular Material you have to do it manually following the @Coly010 instructions here and here.

In short, go to the "project.json" file and change the following: . within "build":

  • change the "executor" value to: "@angular-devkit/build-angular:browser"
  • change the "main" value to: "apps/[your project name here]/src/bootstrap.ts"
  • then add Material: npx nx g @angular/material:ng-add --project=your project name here
  • check that everything works
  • revert the changes on "project.json" file

That's it!

Issue still present as of today. @gatoenano solution's works like a charm. Thanks.

If it can help here is my Nx report

image