nrwl / nx

Smart Monorepos · Fast CI

Home Page:https://nx.dev

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Nx + Module federation + Angular gives error NG0912 when using ng-zorro-antd

Sir-J opened this issue · comments

Current Behavior

Switching between different pages is given us the following warnings:

NG0912: Component ID generation collision detected. Components 'NzSelectClearComponent' and 'NzSelectClearComponent' with selector 'nz-select-clear' generated the same component ID. To fix this, you can change the selector of one of those components or add an extra host attribute to force a different ID. Find more at https://angular.dev/errors/NG0912
NG0912: Component ID generation collision detected. Components 'NzTextCopyComponent' and 'NzTextCopyComponent' with selector 'nz-text-copy' generated the same component ID. To fix this, you can change the selector of one of those components or add an extra host attribute to force a different ID. Find more at https://angular.dev/errors/NG0912

Expected Behavior

No warning (for us this warning cause errors in production)

GitHub Repo

No response

Steps to Reproduce

  1. create angular workspace
  2. add to package.json ng-zorro-antd: 18.0.1
  3. create host application
  4. crate remote application
  5. start

Nx Report

NX   Report complete - copy this into the issue template

Node   : 20.13.1
OS     : darwin-arm64
npm    : 10.5.2

nx (global)        : 19.0.4
nx                 : 19.4.2
@nx/js             : 19.4.2
@nx/jest           : 19.4.2
@nx/linter         : 19.4.2
@nx/eslint         : 19.4.2
@nx/workspace      : 19.4.2
@nx/angular        : 19.4.2
@nx/cypress        : 19.4.2
@nx/devkit         : 19.4.2
@nx/eslint-plugin  : 19.4.2
@nx/node           : 19.4.2
@nrwl/tao          : 19.4.2
@nx/web            : 19.4.2
@nx/webpack        : 19.4.2
nx-cloud           : 19.0.0
typescript         : 5.4.5
---------------------------------------
Community plugins:
ng-zorro-antd : 18.0.1

Failure Logs

No response

Package Manager Version

No response

Operating System

  • macOS
  • Linux
  • Windows
  • Other (Please specify)

Additional Information

This issue is reproduced when upgrading Angular and ng-zorro-antd to version 17 and more. In version 16 this problem not reproduced

This usually happens when there are two components registered to the single Angular instance in the browser from different places.

In other words, if those components come from ng-zorro-antd, then both your host and remote are using their own bundled copy of the library, meaning each instance is trying to register the same component to the single angular runtime.

The library in this case would likely be better to be shared. It should be done automatically, unless you have specifically chosen to opt out of sharing that package.

If you haven't opted out, I will need a reproduction repo to investigate further.

This usually happens when there are two components registered to the single Angular instance in the browser from different places.

In other words, if those components come from ng-zorro-antd, then both your host and remote are using their own bundled copy of the library, meaning each instance is trying to register the same component to the single angular runtime.

The library in this case would likely be better to be shared. It should be done automatically, unless you have specifically chosen to opt out of sharing that package.

If you haven't opted out, I will need a reproduction repo to investigate further.

I will try to do this (repo) in nearest weekends

similar issue,NzIconService is exported from the tripartite component library