Angular2: Lazy Loading in Angular2 Error: BrowserModule has already been loaded. If you need access to common directives

Standard

While implementing Lazy Loading in Angular 2, came across this error:

EXCEPTION: 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.

screenshot_5

Solution:

As error description is self explanatory, the module for which you want to implement lazy loading shouldn’t import BrowserModule as this is already been imported earlier (mainly in app.component). You should only import BrowserModule once. Other modules should be importing CommonModules instead.

See code below for understanding:

import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common';

import { SearchMovieMainComponent } from './search-movies-main.component';

@NgModule({
    imports: [
        CommonModule
    ],
    declarations: [
        SearchMovieMainComponent
    ]
})
export class SearchMoviesMainModule {
}

 

Advertisements

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s