Wie SystemJs konfiguriert für ImmutableJs in Angular 2 Projekt

Question

so bin versucht zu arbeiten, ich ImmutableJs in meinen Winkel 2-Projekt zu importieren, verwende ich diese Art von systemjs Config

(function(global) { 
    // map tells the System loader where to look for things 
    var map = { 
    'src/client':     'src/client', // 'dist', 
    '@angular':     'node_modules/@angular', 
    'angular2-in-memory-web-api': 'node_modules/angular2-in-memory-web-api', 
    'rxjs':      'node_modules/rxjs', 
    'highcharts':     'node_modules/highcharts', 
    'angular2-highcharts':  'node_modules/angular2-highcharts', 
    'immutable':     'node_modules/immutable/dist' 
    }; 
    // packages tells the System loader how to load when no filename and/or no extension 
    var packages = { 
    'src/client':     { main: 'main.js', defaultExtension: 'js' }, 
    'rxjs':      { defaultExtension: 'js' }, 
    'angular2-in-memory-web-api': { main: 'index.js', defaultExtension: 'js' }, 
    'highcharts':     { defaultExtension: 'js' }, 
    'angular2-highcharts':  { main: 'index.js', defaultExtension: 'js' }, 
    'immutable':     { 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); 

aber es VS-Code pick it tat wenn ich es versuche

import { Immutable } from 'immutable/dist/immutable'; 

ich bekomme das immutable.d.ts ist kein Modul.

import { Immutable } from 'immutable/immutable'; 

fällt einfach nicht finden Modul (obwohl dies funktionieren sollte, da ich unveränderlich unveränderlich/dist Verzeichnis zugeordnet, wo immutable.js befindet). Auf der Suche nach Antworten im Netz konnte ich keine Antwort finden, da ich einige Leute fand, die ähnliche Fragen stellten, die in den letzten 6 Monaten nicht beantwortet wurden. Jede Hilfe wird geschätzt, wenn Sie nur auf eine Quelle verweisen, die im Detail erklären könnte was ist

Answer 1

Die Datei system.config.js hat keinen Einfluss auf die Importanweisungen - es steuert, wie Dateien für den Endbenutzer aufgelöst werden. Als solcher ist der von Position in Ihrer ersten Import-Anweisung korrekt, obwohl "unveränderlich" von selbst wäre auch in Ordnung, da der Lader den Pfad von selbst auflösen wird (Ich bin nicht genau sicher, die Besonderheiten dieses Prozesses, jedoch).

Sie können jedoch nicht das gesamte Immutable-Modul auf diese Weise importieren, da nichts, das als "unveränderlich" bezeichnet wird, niemals in immutable.d.ts exportiert wird. Sie haben 2 Möglichkeiten:

Import ein Wildcard-Modul als eine Variable namens Immutable:

import * as Immutable from 'immutable'; 
... 
//in your code later: 
Immutable.Map({a:1, b:2, c:3}) 

Import eine einzelne Module:

import {Map} from 'immutable'; 
... 
//in your code later: 
Map({a:1, b:2, c:3}) 

Sie müssen noch system.config.js für die konfigurieren Frontend wie folgt:

var map = { 
    ... 
    'immutable':     'node_modules/immutable/dist' 
}; 

var packages = { 
    ... 
    'immutable':     { main: 'immutable.js', defaultExtension: 'js' } 
}; 

, die dem Browser mitteilt, wo die oben verwendeten Exporte zu finden sind.