Unexpected value 'undefined' imported by the module 'AppModule' error in ngModule?

Question

I am using ngModule to group imports and other dependencies. I am using ag grid as data grid. Below is my app.module.ts -

import { NgModule }      from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import {SecurityContextService} from './securitycontext.service';
import { AppComponent }  from './app.component';
import { HttpModule } from '@angular/http';
import {AgGridModule} from 'ag-grid-ng2/main';
import {HeaderComponent} from './app.header';
@NgModule({
  imports: [ BrowserModule,HttpModule,AgGridModule],
  declarations: [ AppComponent,HeaderComponent],
  providers: [  SecurityContextService],
  bootstrap:    [ AppComponent ]
})
export class AppModule { }

I am getting below mentioned exception.

Unexpected value 'undefined' imported by the module 'AppModule'

Below is the stack trace for the exception -

Error: Error: Unexpected value 'undefined' imported by the module 'AppModule' at new BaseException (http://localhost:8000/lib/@angular/compiler/src/facade/exceptions.js:27:23) at eval (http://localhost:8000/lib/@angular/compiler/src/metadata_resolver.js:255:31) at Array.forEach (native) at CompileMetadataResolver.getNgModuleMetadata (http://localhost:8000/lib/@angular/compiler/src/metadata_resolver.js:239:44) at RuntimeCompiler._compileComponents (http://localhost:8000/lib/@angular/compiler/src/runtime_compiler.js:150:47) at RuntimeCompiler._compileModuleAndComponents (http://localhost:8000/lib/@angular/compiler/src/runtime_compiler.js:72:37) at RuntimeCompiler.compileModuleAsync (http://localhost:8000/lib/@angular/compiler/src/runtime_compiler.js:49:21) at PlatformRef_._bootstrapModuleWithZone (http://localhost:8000/lib/@angular/core/src/application_ref.js:368:25) at PlatformRef_.bootstrapModule (http://localhost:8000/lib/@angular/core/src/application_ref.js:361:21) at execute (http://localhost:8000/app/main.js:16:65) Error loading http://localhost:8000/app/main.js

Note: I get this exception only when I use AgGridModule in my imports.

I am using gulp to build my application.

EDIT

Below is Systemjs.config -

// map tells the System loader where to look for things
var map = {
    'app': 'app', // 'dist',
    'rxjs': 'lib/rxjs',
    '@angular': 'lib/@angular',
    'ag-grid-ng2': 'lib/ag-grid-ng2',
    'ag-grid-enterprise': 'lib/ag-grid-enterprise',
    'ag-grid': 'lib/ag-grid',
     '@angular/router':  'lib/@angular/router',
     'angular2-in-memory-web-api': 'lib/angular2-in-memory-web-api',
};

// packages tells the System loader how to load when no filename and/or no extension
var packages = {
    'app': {main: 'main.js', defaultExtension: 'js'},
    'rxjs': {defaultExtension: 'js'},
     'ag-grid-ng2': {
        defaultExtension: "js"
    },
    'ag-grid': {
        defaultExtension: "js"
    },
    'ag-grid-enterprise': {
        defaultExtension: "js"
    },
    'angular2-in-memory-web-api': {
                main: './index.js',
                defaultExtension: 'js'
            },
};

var packageNames = [
    '@angular/common',
    '@angular/compiler',
    '@angular/core',
    '@angular/http',
    '@angular/platform-browser',
    '@angular/platform-browser-dynamic',
    '@angular/router',
    '@angular/router-deprecated',
    '@angular/testing',
    '@angular/upgrade',
    '@angular/forms'
];

// add package entries for angular packages in the form '@angular/common': { main: 'index.js', defaultExtension: 'js' }
packageNames.forEach(function (pkgName) {
    packages[pkgName] = {main: 'index.js', defaultExtension: 'js'};
});

var config = {
    map: map,
    packages: packages
};

// filterSystemConfig - index.html's chance to modify config before we register it.
if (global.filterSystemConfig) {
    global.filterSystemConfig(config);
}

System.config(config);

Answer 1

I'm not entirely sure that this will fix your problem, but if you're using ng2 with ag-grid, then you need to pull in the AgGridModule as follows:

@NgModule({
imports: [
    BrowserModule,
    AgGridModule.forRoot(),
    ...
})

The forRoot bit is there so that clients don't have to declare the module at the root level.