Angular2：ng2-file-upload：無法使用SystemJS正確加載它

Question

我正在使用systemJS來管理我的包，所以我已經將這些行添加到我的systemjs的配置文件中：

{
  map: { 'ng2-file-upload': 'node_modules/ng2-file-upload' },
  packages: {
    'ng2-file-upload': {
        main: './ng2-file-upload/ng2-file-upload.js', // also tried with './ng2-file-upload.js'
        defaultExtension: 'js'
    },
  }
}

我通過導入NG2文件上傳 import { FileDrop, FileUploader } from 'ng2-file-upload'; 。

但導入導致我的應用程序“崩潰”：我的typscript編譯器似乎運行良好（我可以看到由於其他代碼的日志），但修改不再被轉換，所以我不能運行任何東西。 我沒有與ng2-file-upload相關的任何錯誤日志（除了大量Duplicate identifiers ）。

任何的想法 ？

編輯：我已將此包從node_modules提取到我的應用程序（ vendor ）附近的文件夾，我使用相對路徑導入FileDrop和FileUploader但systemjs無法導入：

Error: SyntaxError: Unexpected token <(…)

編輯2：這是一些細節。 我的應用程序在一個包含2個子文件夾的public文件下： src和build 。 我在src寫了ts代碼（很明顯），我的tsc保存了轉換后的文件來build 。 目前，我沒有捆綁我的文件，因此build內部的層次結構與src層次相同。

但奇怪的事情只發生與NG2文件上傳 ：transpiling期間，TSC添加node_modules/ng2-file-upload文件夾里面build 。 這是樹木：

public
|-- build
|    |-- core
|    |-- modules
|    |-- styles
|    |-- node_modules
|    |    |-- ng2-file-upload
+-- src
    |-- core
    |-- modules
    |-- styes

我不知道為什么TSC會轉發這個包。 當然， node_modules被排除在我的tsconfig.ts 。

Answer 1

這是我的systemjs.config工作：

      var map = {
    'app': 'app', // 'dist',
    'rxjs': 'node_modules/rxjs',
    'angular2-in-memory-web-api': 'node_modules/angular2-in-memory-web-api',
    '@angular': 'node_modules/@angular',
    'ng2-file-upload': 'node_modules/ng2-file-upload'
};


var packages = {
    'app': { main: 'main.js', defaultExtension: 'js' },
    'rxjs': { defaultExtension: 'js' },
    'angular2-in-memory-web-api': { defaultExtension: 'js' },
    'ng2-file-upload': { main: 'ng2-file-upload.js', defaultExtension: 'js' }
};

Answer 2

我會嘗試這個配置：

{
  map: { 'ng2-file-upload': 'node_modules/ng2-file-upload' },
  packages: {
    'ng2-file-upload': {
      defaultExtension: 'js'
    },
    (...)
  }
}

並以這種方式導入：

import { FileDrop, FileUploader } from 'ng2-file-upload/ng2-file-upload';