BrowserModule уже загружен

Question

Это мой код:

 import { CommonModule } from '@angular/common';
    import { HttpClientModule } from '@angular/common/http';
    import { NgModule } from '@angular/core';
    import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
    import { LanguageTranslationModule } from './shared/modules/language-translation/language-translation.module'

    import { AppRoutingModule } from './app-routing.module';
    import { AppComponent } from './app.component';
    import { AuthGuard } from './shared';

    import { SidebarComponent } from './layout/components/sidebar/sidebar.component';
    import { HeaderComponent } from './layout/components/header/header.component';

    @NgModule({
        imports: [
            CommonModule,
            BrowserAnimationsModule,
            HttpClientModule,
            LanguageTranslationModule,
            AppRoutingModule

        ],
        declarations: [AppComponent,HeaderComponent,SidebarComponent],
        providers: [AuthGuard],
        bootstrap: [AppComponent],
        exports: [
            HeaderComponent,
            SidebarComponent
      ],

    })
    export class AppModule {}

Не знаю, почему я получаю это исключение:

Ошибка: BrowserModule уже загружен. Если вам нужен доступ к общие директивы, такие как NgIf и NgFor из лениво загруженного модуля, вместо этого импортируйте CommonModule. Ошибка: BrowserModule уже был загружен. Если вам нужен доступ к общим директивам, таким как NgIf и NgFor из лениво загруженного модуля, импорт

В будущем модуль я импортирую CommonModule, а не BrowerModule. Кто-нибудь может мне помочь?

Answer 1

Импорт BrowserAnimationsModule и HttpModule только один раз (либо в вашем корневом модуле, либо в модуле ядра).

импорт этих упомянутых модулей только один раз (только в модуле приложения):

BrowserModule, BrowserAnimationsModule, LazyLoadImageModule (при использовании), CarouselModule (при использовании), InfiniteScrollModule (при использовании), HttpModule (при использовании)

Answer 2

Импорт BrowserAnimationsModule в Только для AppModule , поскольку BrowserAnimationsModule по умолчанию импортирует BrowserModule, Нет необходимости определять BrowserModule в app.module.ts, а затем импортировать CommonModule в ваш дочерний / признаковый модуль.

 @NgModule({
imports:      [ 
                BrowserAnimationsModule
                ]
})    
export class ParentModule {}

Избранные / дочерние модули

    @NgModule({
           imports:      [ CommonModule ]
     })   
export class FeaturedModule {}

Надеюсь, это решит вашу проблему

Answer 3

Замените CommonModule на BrowserModule в вашем AppModule.

import { BrowserModule} from '@angular/platform-browser';
import { HttpClientModule } from '@angular/common/http';
import { NgModule } from '@angular/core';
import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
import { LanguageTranslationModule } from './shared/modules/language-translation/language-translation.module'

import { AppRoutingModule } from './app-routing.module';
import { AppComponent } from './app.component';
import { AuthGuard } from './shared';

import { SidebarComponent } from './layout/components/sidebar/sidebar.component';
import { HeaderComponent } from './layout/components/header/header.component';

@NgModule({
    imports: [
        BrowserModule,
        BrowserAnimationsModule,
        HttpClientModule,
        LanguageTranslationModule,
        AppRoutingModule

    ],
    declarations: [AppComponent,HeaderComponent,SidebarComponent],
    providers: [AuthGuard],
    bootstrap: [AppComponent],
    exports: [
        HeaderComponent,
        SidebarComponent
  ],

})
export class AppModule {}