typescript - Angular2: ng2-file-upload：无法使用 SystemJS 正确加载它

我正在使用 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。

但是导入会导致我的应用程序“崩溃”：我的 TypeScript 编译器似乎工作正常（我可以看到其他代码的日志），但修改后的内容不再被转译，所以我无法运行任何东西。我没有与 ng2-file-upload 相关的任何错误日志（除了大量的 重复标识符）。

有什么主意吗？

编辑：我已将此包从 node_modules 提取到靠近我的应用程序的文件夹（vendor），并且我使用相对路径导入了 FileDrop 和 FileUploader，但是 systemjs 导入失败：

Error: SyntaxError: Unexpected token <(…)

编辑 2： 这里有一些细节。我的应用程序在一个 public 文件夹下，该文件夹包含两个子文件夹：src 和 build。我在 src 中编写 ts 代码（这是显而易见的），我的 tsc 会将转译后的文件保存到 build 中。目前，我没有打包我的文件，所以 build 内的层级结构与 src 的相同。

但只有在使用 ng2-file-upload 时会发生一些奇怪的情况：在转译过程中，tsc 会在 build 目录下添加一个 node_modules/ng2-file-upload 文件夹。目录结构如下：

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

我不知道为什么 TSC 会转译这个包。当然，我的 tsconfig.ts 中已经排除了 node_modules。

答案＃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' }
};

答案＃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';