BrowserModule has already been loaded error when importing an angular library that imports BrowserModule

Which @angular/* package(s) are the source of the bug?

platform-browser

Is this a regression?

No

Description

I am trying to use a component from an angular library (SharedModule) and get the console error:

BrowserModule has already been loaded. If you need access to common directives such as NgIf and NgFor from a lazy loaded module, import CommonModule instead.

Both the SharedModule from the library and the AppModule in the app have the imports import { BrowserModule } from ‘@angular/platform-browser’; import { BrowserAnimationsModule } from ‘@angular/platform-browser/animations’;

The library is imported into the AppModule using import { SharedModule as pdlSharedModule } from ‘pdl’;

If I remove the Browser imports from SharedModule and try to use CommonModule instead, I get the console error message NullInjectorError: R3InjectorError(t)[y -> y -> y -> y]: when I try to access

If I remove the Browser imports from AppModule that gets the same NullInjectorError but on the first page.

user.module.ts.txt app.module.ts.txt shared.module.ts.txt

This configuration worked in a9.

Please provide a link to a minimal reproduction of the bug

No response

Please provide the exception or error you saw

ERROR Error: Uncaught (in promise): Error: BrowserModule has already been loaded. If you need access to common directives such as NgIf and NgFor from a lazy loaded module, import CommonModule instead.
Error: BrowserModule has already been loaded. If you need access to common directives such as NgIf and NgFor from a lazy loaded module, import CommonModule instead.
    at new qe (main.js:1)
    at Object.qe.ɵfac [as factory] (main.js:1)
    at I3.hydrate (main.js:1)
    at I3.get (main.js:1)
    at main.js:1
    at Set.forEach (<anonymous>)
    at I3._resolveInjectorDefTypes (main.js:1)
    at new Wg (main.js:1)
    at If.create (main.js:1)
    at i.project (main.js:1)
    at A (polyfills.js:1)
    at A (polyfills.js:1)
    at polyfills.js:1
    at h.invokeTask (polyfills.js:1)
    at Object.onInvokeTask (main.js:1)
    at h.invokeTask (polyfills.js:1)
    at h.runTask (polyfills.js:1)
    at m (polyfills.js:1)
    at h.invokeTask [as invoke] (polyfills.js:1)
    at y (polyfills.js:1)

Please provide the environment you discovered this bug in

Angular CLI: 12.2.6
Node: 12.19.0
Package Manager: npm 6.14.8
OS: darwin x64

Angular: 12.2.6
... animations, cli, common, compiler, compiler-cli, core, forms
... language-service, platform-browser, platform-browser-dynamic
... router

Anything else?

No response

[jbistis]

We are working on a small reproduction of the issue.

[angular-automatic-lock-bot[bot]]

This issue has been automatically locked due to inactivity. Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

_{This action has been performed automatically by a bot.}