title: Angular2 Tutorial (Tour of Heroes): Cannot find module 'angular2-in-memory-web-api'
body: <p>I have followed the <a href="https://angular.io/docs/ts/latest/tutorial/" rel="noreferrer">Tutorial</a>. After changing <code>app/maint.ts</code> in the Http chapter I get the error when starting the app via command line: </p>
  
  <blockquote>
    <p>app/main.ts(5,51): error TS2307: Cannot find module 'angular2-in-memory-web-api'.</p>
  </blockquote>
  
  <p>(Visual Studio Code gives me the same error within main.ts - red wavy underlining.)</p>
  
  <p>Here is my <code>systemjs.config.js</code>:</p>
  
  <pre><code>/**
   * System configuration for Angular 2 samples
   * Adjust as necessary for your application needs.
   */
  (function(global) {
    // map tells the System loader where to look for things
    var map = {
      'app':                        'app', // 'dist',
      '@angular':                   'node_modules/@angular',
      'angular2-in-memory-web-api': 'node_modules/angular2-in-memory-web-api',
      'rxjs':                       'node_modules/rxjs'
    };
    // 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' },
      'angular2-in-memory-web-api': { defaultExtension: 'js' },
    };
    var ngPackageNames = [
      'common',
      'compiler',
      'core',
      'http',
      'platform-browser',
      'platform-browser-dynamic',
      'router',
      'router-deprecated',
      'upgrade',
    ];
    // Add package entries for angular packages
    ngPackageNames.forEach(function(pkgName) {
      packages['@angular/'+pkgName] = { main: pkgName + '.umd.js', defaultExtension: 'js' };
    });
    var config = {
      map: map,
      packages: packages
    }
    System.config(config);
  })(this);
  </code></pre>
  
  <p>Here is my <code>app/main.ts</code>:</p>
  
  <pre><code>// Imports for loading &amp; configuring the in-memory web api
  import { provide }    from '@angular/core';
  import { XHRBackend } from '@angular/http';
  
  import { InMemoryBackendService, SEED_DATA } from 'angular2-in-memory-web-api';
  import { InMemoryDataService }               from './in-memory-data.service';
  
  // The usual bootstrapping imports
  import { bootstrap }      from '@angular/platform-browser-dynamic';
  import { HTTP_PROVIDERS } from '@angular/http';
  
  import { AppComponent }   from './app.component';
  
  bootstrap(AppComponent, [
      HTTP_PROVIDERS,
      provide(XHRBackend, { useClass: InMemoryBackendService }), // in-mem server
      provide(SEED_DATA,  { useClass: InMemoryDataService })     // in-mem server data
  ]);
  </code></pre>