chore(mf): Migrate to Angular 22 - #1120
Merged
Merged
Conversation
|
Hi, When will it be merged and available? |
Angular 22 no longer writes outputPath into angular.json, which made
generateSsrMappings throw "The 'to' argument must be of type string" and
aborted `init` on any workspace with a second application. Default it to
dist/<project> and unwrap the application builder's { base, browser } form.
Also fixes three defects that stopped a generated host from loading a
remote on Angular 22:
- The rspack config never declared any assets, so the public/mf.manifest.json
written by the same schematic 404'd and a dynamic host could not resolve
its remotes.
- license-webpack-plugin cannot read Module Federation's synthetic container
modules (they have no resource path), which failed every production build
on webpack and every host build on rspack. License extraction is now off,
and both schematics say so, since 3rdpartylicenses.txt is no longer emitted.
- The webpack dev-server sent no Access-Control-Allow-Origin header, so a
host could not import remoteEntry.js from another origin.
Verified end to end in fresh Angular 22 workspaces on both stacks: a host
renders a remote's exposed component cross-origin, and production builds pass.
@nx/js:verdaccio forks require.resolve('verdaccio/bin/verdaccio'), a subpath
verdaccio 6 no longer lists in its exports map. It threw
ERR_PACKAGE_PATH_NOT_EXPORTED while the target still exited 0, so the registry
silently never came up. Pinning verdaccio back is not an option: @nx/js 23.1.0
itself declares verdaccioVersion '^6.3.2'.
Resolve the CLI through verdaccio/package.json (which is exported) and run it
directly, polling /-/ping for readiness. start-local-registry.ts also
referenced a local-registry target on a project that no longer exists.
Two problems this surfaced:
- kill() left verdaccio running and orphaned, still holding port 4873, because
it ignores SIGTERM while holding keep-alive connections. Shutdown now
escalates to SIGKILL, and globalTeardown awaits it.
- A registry left over from an earlier run answers the readiness ping on the
first poll, so the wait loop reported success for a child about to die on
EADDRINUSE. A preflight check now refuses to start in that case.
Verified: starts, publishes (previously ENEEDAUTH), stops cleanly with no
orphan, and fails loudly when the port is taken.
@angular-eslint 22 is flat-config only and exports no eslintrc-style configs, so `plugin:@nx/angular` could no longer resolve `plugin:@angular-eslint/ recommended`. Every Angular-flavoured project failed to lint at all: mf-runtime, mf-tools, native-federation-runtime and playground-lib. Converted with @nx/eslint:convert-to-flat-config, then removed the FlatCompat layer it emitted. FlatCompat pulls in @eslint/eslintrc, which crashes on `import minimatch from 'minimatch'` because the minimatch override in package.json forces v10, where there is no default export. The only thing it was used for was `env: { jest: true }`, now expressed natively via `globals`. @eslint/eslintrc is no longer a dependency. Fallout the restored linting exposed: - fstart.mjs is an esbuild bundle, not source, so it is ignored rather than linted. - import-map-loader.js had genuine prefer-const violations. Fixed, and loader-as-data-url.js regenerated since it embeds that file as base64. - The playground and mfe1 demo components still used *ngIf and constructor injection, which Angular 22's rules reject. Moved to @if and inject(). Also drops the redundant serialize-javascript override: it resolves to 7.0.7 either way now. The minimatch override is kept, since removing it pulls a vulnerable minimatch back in through postcss-url. All 16 projects lint clean. The pre-existing build/test failures in native-federation, native-federation-node, mfe1 and playground are unchanged by this commit, verified against a stashed baseline.
mf-tools had no specs at all, so `nx run mf-tools:test` reported success while running nothing, and the package was only ever verified to compile. None of its runtime behaviour had been exercised on Angular 22. Covers the reason the package exists: a shell and a micro frontend on the same Angular version must share one platform rather than each creating their own, and the shell's NgZone must reach remotes through both the namespaced global state and the legacy window slot. Also pins getMajor's prerelease handling, where a suffix has to survive so 16-next.3 cannot collide with 16. Verified the platform assertion actually bites by making getPlatform skip its cache: the spy then records two calls instead of one and the test fails. Adding the first spec also made jest type-check test-setup.ts for the first time, which surfaced an obsolete @ts-expect-error on a line that now types cleanly.
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
2 participants
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
This pull request introduces major updates to support Angular 22 and transitions the experimental builder integration from rsbuild to rspack. It updates dependencies, configuration files, and documentation to reflect these changes, and refactors the rspack integration to use the Nx-maintained
@nx/angular-rspackpackage. The pull request also removes legacy rsbuild code and improves the Module Federation setup for rspack, ensuring compatibility with Angular 22 and simplifying the developer experience.Key changes:
Angular 22 and Dependency Updates
@angular-architects/module-federation,@angular-architects/module-federation-runtime, and@angular-architects/module-federation-toolsto22.0.0, and updated peer and internal dependencies to require Angular 22 and@angular-builders/custom-webpackinstead ofngx-build-plus. [1] [2] [3] [4] [5]Migration from rsbuild to rspack
@nx/angular-rspackfor the builder integration. [1] [2] [3] [4] [5] [6] [7] [8] [9] [10] [11] [12]Rspack Module Federation integration improvements
with-federation.tsto use rspack'sConfigurationtype andModuleFederationPlugin, ensuring correct configuration for ES modules, improved shared mappings, and dev server tweaks for CORS and HMR settings.Documentation and Configuration Changes
README.mdto reference rspack instead of rsbuild, clarified builder usage, and documented the switch fromngx-build-plusto@angular-builders/custom-webpackfor Angular 22+. [1] [2] [3]tsconfig.jsonfiles to"strict": falsefor both runtime and tools libraries.These changes collectively modernize the library for Angular 22, improve developer experience with rspack, and ensure continued compatibility and maintainability.