@mnc-software/mosaic-build-plus

@mnc-software/mosaic-build-plus is an Angular builder that wraps ngx-build-plus:browser and adds Mosaic-specific packaging steps:

• Generate manifest.json from:
  • angular.json build metadata
  • Module Federation exposes from webpack config
  • TypeScript source analysis (ICustomWidget and @Option(...))
• Copy manifest.json to output root
• Copy i18n folder to output root
• Optionally create .wmd package (zip containing manifest.json, ngwebmodule, i18n)

Builder Name

@mnc-software/mosaic-build-plus:browser

Example angular.json configuration

{
  "projects": {
    "myapp": {
      "architect": {
        "build": {
          "builder": "@mnc-software/mosaic-build-plus:browser",
          "options": {
            "index": "src/index.html",
            "main": "src/main.ts",
            "tsConfig": "tsconfig.app.json",
            "extraWebpackConfig": "webpack.config.js",
            "manifestPath": "manifest.json",
            "angularConfigPath": "angular.json",
            "projectName": "myapp",
            "widgetLabelPrefix": "DashboardWidget.",
            "generateManifest": true,
            "copyManifest": true,
            "i18nPath": "i18n",
            "copyI18n": true
          },
          "configurations": {
            "production": {
              "createWmd": true
            },
            "development": {
              "createWmd": false
            }
          }
        }
      }
    }
  }
}

Builder options

• outputPath: Optional. Defaults to dist/ngwebmodule.
• manifestPath: Source manifest path. Default manifest.json.
• angularConfigPath: Path to angular workspace config. Default angular.json.
• projectName: Optional explicit angular project name.
• widgetLabelPrefix: Optional prefix for widget labels in generated manifest widgetData entries. Defaults to DashboardWidget..
• webpackConfigPath: Optional explicit webpack config path. Defaults to active build config.
• generateManifest: Default true.
• copyManifest: Default true.
• i18nPath: Source i18n folder. Default i18n.
• copyI18n: Default true.
• outputRoot: Optional packaging root. Defaults to dirname(outputPath).
• createWmd: Optional. If omitted:
  • WMD_PACKAGE=true => force on
  • WMD_PACKAGE=false => force off
  • otherwise defaults to on
• wmdFileName: Optional package file name. Defaults to ${manifest.name}.wmd.

All standard ngx-build-plus:browser options are also passed through.

WMD file name and manifest name resolution

The generated WMD package file name is resolved in this order:

1. wmdFileName builder option (if provided)
2. ${manifest.name}.wmd
3. module.wmd (only if manifest.name is missing)

manifest.name is resolved in this order when manifest generation is enabled:

1. Module Federation plugin name from webpack config (new ModuleFederationPlugin({ name: ... }))
2. package.json name
3. Angular projectName

This means the Angular project name is a fallback, not the primary source.

Example

If your Angular project is clientproptest but your Module Federation name is mfe1, the package will default to mfe1.wmd.

To force a specific package name regardless of manifest contents, set:

{
  "projects": {
    "myapp": {
      "architect": {
        "build": {
          "options": {
            "wmdFileName": "clientproptest.wmd"
          }
        }
      }
    }
  }
}

Troubleshooting

• Seeing an unexpected filename like mfe1.wmd:
  • Check manifest.json name
  • Check webpack Module Federation name
  • Check package.json name
  • If needed, set wmdFileName explicitly

Publishing

1. Ensure package metadata is correct in package.json.
2. Pack locally:
   • npm pack
3. Publish to npm/artifactory using your normal registry workflow.

Notes

• Widget/component classification is source-based:
  • implements ICustomWidget => widgetData
  • otherwise => componentData
• Widget options are parsed from class property @Option(...) decorators.