Cannot find module '@angular-architects/module-federation/webpack'

[vishalgvk]

Overview of the issue

When a JHipster project is being created from a JDL file, the generated gateway works fine but build fails for microservice apps stating: Cannot find module '@angular-architects/module-federation/webpack'

Reproduce the error

Source JDL: jdlFileContent.txt JDL file in .txt format
Use: jhipster jdl microservices.jdl --workspaces to create JHipster project
After starting keycloak and Consul, start gateway using mvnw -> works fine
Then start microservices apps (store/blog) using mvnw -> build fails. build failure screenshot

Suggest a Fix

I tried multiple ways and found that creating JHipster project with jhipster jdl microservices.jdl --monorepository --workspaces resolves the above issue.

Solution: Include --monorepository

Including --monorepository always in live projects isn't recommended (as we do not prefer common Git repo for all the apps).
Linked stackoverflow question

Brief config

JHipster - v8.1.0
Node - v18.19.0
Java - v17
NPM - v9.8.1

JHipster configuration

.yo-rc.json file

{
  "generator-jhipster": {
    "appsFolders": [
      "gateway",
      "blog",
      "store"
    ],
    "baseName": "workspaces",
    "clientPackageManager": "npm",
    "directoryPath": "./",
    "jhipsterVersion": "8.1.0"
  }
}

.yo-rc.json file for gateway

{
  "generator-jhipster": {
    "applicationIndex": 0,
    "applicationType": "gateway",
    "applications": {
      "blog": {
        "applicationIndex": 1,
        "clientFramework": "angular",
        "serverPort": "8081"
      },
      "store": {
        "applicationIndex": 2,
        "clientFramework": "angular",
        "serverPort": "8082"
      }
    },
    "authenticationType": "oauth2",
    "baseName": "gateway",
    "buildTool": "maven",
    "clientFramework": "angular",
    "databaseType": "sql",
    "devDatabaseType": "mariadb",
    "devServerPort": 4200,
    "entities": [],
    "jhipsterVersion": "8.1.0",
    "languages": [
      "en"
    ],
    "microfrontends": [
      {
        "baseName": "blog"
      },
      {
        "baseName": "store"
      }
    ],
    "nativeLanguage": "en",
    "packageFolder": "com/myapp/gateway",
    "packageName": "com.myapp.gateway",
    "prodDatabaseType": "mariadb",
    "reactive": true,
    "serviceDiscoveryType": "consul",
    "skipUserManagement": true,
    "testFrameworks": [
      "cypress"
    ]
  }
}

.yo-rc.json file for blog

{
  "generator-jhipster": {
    "applicationIndex": 1,
    "applicationType": "microservice",
    "authenticationType": "oauth2",
    "baseName": "blog",
    "buildTool": "maven",
    "clientFramework": "angular",
    "databaseType": "sql",
    "devDatabaseType": "mariadb",
    "devServerPort": 4201,
    "enableHibernateCache": false,
    "entities": [
      "Blog",
      "Post",
      "Tag"
    ],
    "jhipsterVersion": "8.1.0",
    "languages": [
      "en"
    ],
    "lastLiquibaseTimestamp": 1704344536000,
    "nativeLanguage": "en",
    "packageFolder": "com/myapp/blog",
    "packageName": "com.myapp.blog",
    "prodDatabaseType": "mariadb",
    "reactive": false,
    "serverPort": "8081",
    "serviceDiscoveryType": "consul",
    "skipUserManagement": true,
    "testFrameworks": [
      "cypress"
    ]
  }
}

.yo-rc.json file for store

{
  "generator-jhipster": {
    "applicationIndex": 2,
    "applicationType": "microservice",
    "authenticationType": "oauth2",
    "baseName": "store",
    "buildTool": "maven",
    "clientFramework": "angular",
    "databaseType": "sql",
    "devDatabaseType": "mariadb",
    "devServerPort": 4202,
    "enableHibernateCache": false,
    "entities": [
      "Product"
    ],
    "jhipsterVersion": "8.1.0",
    "languages": [
      "en"
    ],
    "lastLiquibaseTimestamp": 1704344416000,
    "nativeLanguage": "en",
    "packageFolder": "com/myapp/store",
    "packageName": "com.myapp.store",
    "prodDatabaseType": "mariadb",
    "reactive": false,
    "serverPort": "8082",
    "serviceDiscoveryType": "consul",
    "skipUserManagement": true,
    "testFrameworks": [
      "cypress"
    ]
  }
}

Environment and Tools

java version "17.0.9" 2023-10-17 LTS
Java(TM) SE Runtime Environment (build 17.0.9+11-LTS-201)
Java HotSpot(TM) 64-Bit Server VM (build 17.0.9+11-LTS-201, mixed mode, sharing)

git version 2.40.0.windows.1

node: v18.19.0
npm: 9.8.1

Docker version 24.0.7, build afdd53b

Browsers and Operating System

Google Chrome v120.0.6099.130
Windows 11 v23H2

[mshima]

--workspaces won’t work correctly without --monorepository.
--workspaces uses npm workspaces that hoist packages to the root.
package-lock.json at workspaces (microservices) will be broken if you try to mix.

In that case we should add a scripts folder or use shells scripts instead of npm scripts.
We need to test if each microservice builds standalone.

[vishalgvk]

Thanks for your reply @mshima
Now I understand that I have to combinedly include --monorepository and --workspaces
But the issue persists even if I omit both of them i.e. creating a JHipster project by executing only:

jhipster jdl microservices.jdl

[mshima]

Thanks for your reply @mshima Now I understand that I have to combinedly include --monorepository and --workspaces But the issue persists even if I omit both of them i.e. creating a JHipster project by executing only:

jhipster jdl microservices.jdl

Looks like --workspaces is enabled by default. It shouldn't.

[mshima]

Microservice with angular microfrontend is missing a dependency.