Open Sir-J opened 2 months ago
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
@Coly010 I create test repository (see main comment).
How reproduce:
npm run start
In browser you will see:
All information in English.
Then go to remote application and you will see:
A like image, but <nz-empty>
component rendering in Chinese (default config).
import { ApplicationConfig, provideZoneChangeDetection } from '@angular/core';
import { provideRouter } from '@angular/router';
import { appRoutes } from './app.routes';
import { en_US, provideNzI18n } from 'ng-zorro-antd/i18n';
import en from '@angular/common/locales/en';
import { registerLocaleData } from '@angular/common';
registerLocaleData(en);
export const appConfig: ApplicationConfig = {
providers: [
provideZoneChangeDetection({ eventCoalescing: true }),
provideRouter(appRoutes),
provideNzI18n(en_US),
],
};
In app.config.ts
I set globally English
+1
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
nx-mfe-ng-zorro
Steps to Reproduce
ng-zorro-antd
:18.0.1
Nx Report
Failure Logs
No response
Package Manager Version
No response
Operating System
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