projekt/ng2-responsive 404 error

Your install guide didn’t work in the first place with ng2-Final, typescript 2.0.2 for the Angular Get Started App.

I resolved the issue with adding 'responsive': 'npm:ng2-responsive', and 'ng2-responsive': { main: './index.js', defaultExtension: 'js' } to system.config.js.

app.module.ts

import {NgModule} from '@angular/core';
import {BrowserModule} from '@angular/platform-browser';

import {MdCoreModule} from '@angular2-material/core';
import {MdSidenavModule} from '@angular2-material/sidenav';

import {Ng2BootstrapModule} from "ng2-bootstrap/ng2-bootstrap";

import {AppComponent} from "./app.component";
import {ResponsiveModule} from "ng2-responsive";

@NgModule({
    imports:      [
        BrowserModule,
        ResponsiveModule,
        Ng2BootstrapModule,
        MdCoreModule,
        MdSidenavModule
    ],
    declarations: [
        AppComponent
    ],
    bootstrap:    [
        AppComponent
    ]
})

export class AppModule { }

system.config.js

(function (global) {
    System.config({
        paths: {
            // paths serve as alias
            'npm:': 'node_modules/'
        },
        // map tells the System loader where to look for things
        map: {
            // our app is within the app folder
            app: 'app',
            // angular bundles
            '@angular/core': 'npm:@angular/core/bundles/core.umd.js',
            '@angular/common': 'npm:@angular/common/bundles/common.umd.js',
            '@angular/compiler': 'npm:@angular/compiler/bundles/compiler.umd.js',
            '@angular/platform-browser': 'npm:@angular/platform-browser/bundles/platform-browser.umd.js',
            '@angular/platform-browser-dynamic': 'npm:@angular/platform-browser-dynamic/bundles/platform-browser-dynamic.umd.js',
            '@angular/http': 'npm:@angular/http/bundles/http.umd.js',
            '@angular/router': 'npm:@angular/router/bundles/router.umd.js',
            '@angular/forms': 'npm:@angular/forms/bundles/forms.umd.js',

            '@angular2-material/core': 'npm:@angular2-material/core/core.umd.js',
            '@angular2-material/sidenav': 'npm:@angular2-material/sidenav/sidenav.umd.js',
            // other libraries
            'rxjs':                       'npm:rxjs',
            'angular2-in-memory-web-api': 'npm:angular2-in-memory-web-api',

            'ng2-responsive': 'npm:ng2-responsive',

            'moment': 'node_modules/moment/moment.js'
        },
        // packages tells the System loader how to load when no filename and/or no extension
        packages: {
            app: {
                main: './main.js',
                defaultExtension: 'js'
            },
            rxjs: {
                defaultExtension: 'js'
            },
            'angular2-in-memory-web-api': {
                main: './index.js',
                defaultExtension: 'js'
            },
            'ng2-responsive': {
                main: './index.js',
                defaultExtension: 'js'
            }
        }
    });
})(this);

[renooo]

@well-made you can try declare every path explicitely in your systemjs.config.js :

(function (global) {
  System.config({
    paths: {
      // paths serve as alias
      'npm:': 'node_modules/'
    },
    // map tells the System loader where to look for things
    map: {
      // our app is within the app folder
      app: 'app',
      //..
      // other libraries   
      'ng2-responsive/bootstrap': 'npm:ng2-responsive/bootstrap',
      'ng2-responsive/browsers': 'npm:ng2-responsive/browsers',
      'ng2-responsive/config': 'npm:ng2-responsive/config',
      'ng2-responsive/custom-sizes': 'npm:ng2-responsive/custom-sizes',
      'ng2-responsive/devices': 'npm:ng2-responsive/devices',
      'ng2-responsive/pixelratio': 'npm:ng2-responsive/pixelratio',
      'ng2-responsive/responsive': 'npm:ng2-responsive/responsive',
      'ng2-responsive/responsive-window': 'npm:ng2-responsive/responsive-window',
      'ng2-responsive/useragent': 'npm:ng2-responsive/useragent',
      'ng2-responsive': 'npm:ng2-responsive'
    },
    // packages tells the System loader how to load when no filename and/or no extension
    packages: {
      app: {
        main: './main.js',
        defaultExtension: 'js'
      },
      //..........
      'ng2-responsive/bootstrap': {
        main: './index.js',
        defaultExtension: 'js'
      },
      'ng2-responsive/browsers': {
        main: './index.js',
        defaultExtension: 'js'
      },
      'ng2-responsive/config': {
        main: './index.js',
        defaultExtension: 'js'
      },
      'ng2-responsive/custom-sizes': {
        main: './index.js',
        defaultExtension: 'js'
      },
      'ng2-responsive/devices': {
        main: './index.js',
        defaultExtension: 'js'
      },
      'ng2-responsive/pixelratio': {
        main: './index.js',
        defaultExtension: 'js'
      },
      'ng2-responsive/responsive': {
        main: './index.js',
        defaultExtension: 'js'
      },
      'ng2-responsive/responsive-window': {
        main: './index.js',
        defaultExtension: 'js'
      },
      'ng2-responsive/useragent': {
        main: './index.js',
        defaultExtension: 'js'
      },
      'ng2-responsive': {
        main: './index.js',
        defaultExtension: 'js'
      }
    }
  });
})(this);

[well-made]

Unfortunately I’m having the same problem as @lax20attack and @PickleyD. Have everything set up like @p5hema2 but no luck.