如何配置SystemJs爲ImmutableJs在角2項目工作

Question

，所以我試圖導入ImmutableJs到我的角2的項目中，我使用這種systemjs配置

(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); 

，但它VS代碼犯規挑吧當我嘗試

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

我知道immutable.d.ts不是一個模塊。

import { Immutable } from 'immutable/immutable'; 

只是下降找不到模塊（儘管因爲我映射不可改變到immutable.js駐留不可改變/ dist目錄這應該工作）。在網上搜索我無法找到答案，我發現一些人問過去6個月werent回答的類似問題。任何幫助表示讚賞如果僅僅只是引導到可能在細節解釋什麼什麼

Answer 1

的system.config.js文件不影響import語句源 - 它控制文件的方式爲最終用戶解決。因此，在您第一個導入語句從位置是正確的，但「不可改變的」，其本身也將被罰款，如裝載機將解決其自身的路徑（我不完全相信這個過程的具體情況，然而）。

但是，你不能導入這樣整個不可改變的模塊，因爲沒有所謂的「永恆」是從來沒有在immutable.d.ts出口。你有兩個選擇：

導入一個通配符模塊作爲一個變量，名爲永恆：

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

導入單個模塊：

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

你仍然需要配置該system.config.js前端像這樣：

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

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

告訴瀏覽器在哪裏找到上面使用的導出。