file-upload - Angular 2 : ng2-file-upload : cannot load it correctly using 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'
    },
  }
}

我通过 import { FileDrop, FileUploader } from 'ng2-file-upload'; 导入 ng2-file-upload .

但导入会导致我的应用程序“崩溃”:我的 typscript 编译器似乎运行良好(由于其他代码，我可以看到日志)但是修改不再被转译，所以我无法运行任何东西。我没有任何与 ng2-file-upload 相关的错误日志(除了很多 Duplicate identifiers )。

有什么想法吗？

编辑: 我已经从 node_modules 中提取了这个包到我的应用程序 ( vendor ) 附近的文件夹，我使用相对路径导入 FileDrop和 FileUploader但是 systemjs 导入失败:

Error: SyntaxError: Unexpected token <(…)

编辑 2:这是一些细节。我的申请在 public 下其中包含 2 个子文件夹:src和 build .我在src里面写ts代码(这很明显)我的 tsc 将转译后的文件保存到 build .目前，我没有捆绑我的文件，所以 build 中的层次结构与 src 相同一个。

但是只有 ng2-file-upload 才会发生奇怪的事情:在转译过程中，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' }
};