Angular 4 - 配置 systemjs

Question

我第一次使用systemjs 作为模块加载器。我也在尝试在我的项目中使用ng2-drag-drop plugin。安装后，我将模块导入到我想使用它的模型中，在我的例子中是PostModule。

import { Ng2DragDropModule } from 'ng2-drag-drop';

@NgModule({
  imports: [PostRoutingModule, SharedModule, Ng2DragDropModule],
  declarations: [PostComponent],
  exports: [PostComponent],
  providers: [PostService]
})
export class PostModule { }

正如文档中所说，我已经更改了 systemjs 配置文件：

declare var System: SystemJSLoader.System;

System.config(JSON.parse('<%= SYSTEM_CONFIG_DEV %>'));
System.config({
    map: {
        'ng2-drag-drop': 'node_modules/ng2-drag-drop'
    },
    packages: {
        'ng2-drag-drop':  { main: 'index.js',  defaultExtension: 'js' },
    }
});

但是，我得到一个错误：

获取 http://localhost:5555/node_modules/node_modules/ng2-drag-drop/index.js 404（未找到）（匿名） (SystemJS) XHR 错误 (404 Not Found) 加载 http://localhost:5555/node_modules/node_modules/ng2-drag-drop/index.js

Answer 1

您可以通过以下方式对其进行配置：

System.config({
    paths: {
        'npm:': '/node_modules/'
    },

    map: {
        'ng2-drag-drop': 'npm:ng2-drag-drop'
    },

    packages: {
        'ng2-drag-drop': {
            main: 'index.js',
            defaultExtension: 'js'
        }

    }