Максим Кадров Максим Кадров - 5 months ago 142
Javascript Question

Angular2 node_module rxjs 404 error

I am trying to compile an angular2 app but I get the following error:


Error: XHR error (404 Not Found) loading http://localhost:3000/node_modules/rxjs(…)


systemjs.config.js

(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': {
main: 'index.js',
defaultExtension: 'js'
},
};
var ngPackageNames = [
'common',
'compiler',
'core',
'forms',
'http',
'platform-browser',
'platform-browser-dynamic',
'router',
'router-deprecated',
'upgrade',
];

// Individual files (~300 requests):
function packIndex(pkgName) {
packages['@angular/' + pkgName] = {
main: 'index.js',
defaultExtension: 'js'
};
}

// Bundled (~40 requests):
function packUmd(pkgName) {
packages['@angular/' + pkgName] = {
main: '/bundles/' + pkgName + '.umd.js',
defaultExtension: 'js'
};
}

// Most environments should use UMD; some (Karma) need the individual index files
var setPackageConfig = System.packageWithIndex ? packIndex : packUmd;

// Add package entries for angular packages
ngPackageNames.forEach(setPackageConfig);

var config = {
map: map,
packages: packages
};
System.config(config);

})(this);


The app folder contains:
main.ts
and
YouTubeSearchComponent.ts


What may cause this problem?

Answer

Change your rxjs entry in package to this:

'rxjs': {
    main: '/bundles/Rx.umd.js',
    defaultExtension: 'js'
}