angular2 modal & system.js

Question

system.js lädt nicht die Basis angular2-modal Javascript-Datei und ich habe keine Ahnung warum. Dies ist meine Konfiguration:

(function(global) { 
    var paths = { 
    'npm:': '../node_modules/' 
    }; 
    // map tells the System loader where to look for things 
    var map = { 
    'app':        'js', 
    '@angular/core':      'npm:@angular/core', 
    '@angular/common':     'npm:@angular/common', 
    '@angular/compiler':     'npm:@angular/compiler', 
    '@angular/http':      'npm:@angular/http', 
    '@angular/platform-browser':   'npm:@angular/platform-browser', 
    '@angular/platform-browser-dynamic': 'npm:@angular/platform-browser-dynamic', 
    '@angular/router':     'npm:@angular/router', 
    '@angular/upgrade':     'npm:@angular/upgrade', 
    'rxjs':        'npm:rxjs', 
    'moment':        'npm:moment', 
    'angular2-moment':     'npm:angular2-moment', 
    'angular2-modal':      'npm:angular2-modal/bundles', 
    'angular2-modal-bootstrap':   'npm:angular2-modal/bundles' 
    }; 
    // packages tells the System loader how to load when no filename and/or no extension 
    var packages = { 
    'app':        { main: 'main', defaultExtension: 'js' }, 
    'rxjs':        { defaultExtension: 'js' }, 
    'moment':        { main: './moment', defaultExtension: 'js' }, 
    'angular2-moment':     { main: './index', defaultExtension: 'js' }, 
    'angular2-modal':      { main: './angular2-modal.umd', defaultExtension: 'js' }, 
    'angular2-modal-bootstrap':   { main: './angular2-modal.bootstrap.umd', defaultExtension: 'js' } 
    }; 
    var ngPackageNames = [ 
    'common', 
    'compiler', 
    'core', 
    'http', 
    'platform-browser', 
    'platform-browser-dynamic', 
    'router', 
    'upgrade', 
    ]; 
    // Add package entries for angular packages 
    ngPackageNames.forEach(function(pkgName) { 
    packages['@angular/'+pkgName] = { main: 'bundles/'+pkgName+'.umd.js', defaultExtension: 'js' }; 
    }); 
    var config = { 
    paths, 
    map, 
    packages 
    } 
    System.config(config); 
}(this)); 

Die 'angular2-modal.bootstrap.umd.js' geladen wird (i es im Netzwerk Registerkarte sehen), aber die 'angular2-modal.umd.js' nicht. Das Seltsame ist, wenn ich den Eintrag 'angular2-modal-bootstrap' aus der Datei system.js lösche, wird die Basis 'angular2-modal.umd.js' einfach geladen. Tue ich hier etwas falsch?

Answer 1

sollte diese Arbeit:

var map = { 
    'angular2-modal': 'npm:angular2-modal', 
    'angular2-modal/plugins/bootstrap': 'npm:angular2-modal/bundles', 
} 

var packages = { 
    'angular2-modal': { 
    main: 'bundles/angular2-modal.umd', 
    defaultExtension: 'js' 
    }, 

    "angular2-modal/plugins/bootstrap": { 
    main: 'angular2-modal.bootstrap.umd', 
    defaultExtension: 'js' 
    } 

} 

Warum funktioniert das?

NodeJS löst nicht lokale Pakete ähnlich wie TypeScript Pakete auflöst. Im Grunde sucht NodeJS nach einem Paket mit der Position angular2-modal/plugins/bootstrap, indem es die Verzeichniskette nach oben durchsucht, bis entweder package.json (wenn es eine Haupteigenschaft angibt) oder index.js gefunden wird. In diesem Fall wird das Paket unter node_modules aufgelöst, da es unter node_modules/angular2-modal/plugins/bootstrap eine package.json mit einer main-Eigenschaft gibt, die auf index.js verweist.

Weitere Informationen über das Paket Auflösungsalgorithmus siehe hier: https://www.typescriptlang.org/docs/handbook/module-resolution.html#how-nodejs-resolves-modules

und hier:

https://nodejs.org/api/modules.html#modules_loading_from_node_modules_folders