如何为Angular2安装组件包装器(特别是Dragula)

我对npm和Angular2都很新.我已经按照Angular2的教程创建了一个初始应用程序,我已经拥有了相当可观的东西.
https://angular.io/docs/ts/latest/tutorial/

我需要在我的应用程序中添加拖放功能,并且相信我应该使用Angular而不是jquery-ui本地的东西.我找到了这个插件：

https://github.com/valor-software/ng2-dragula

我按照README中的说明进行操作,看起来它已经安装完毕.它存在于node_modules和ng2-dragula“：”^ 1.0.3已添加到我的依赖项中.然后我运行npm install并启动.

但是,当我尝试使用自述文件中指定的指令和提供程序时,它返回not found(在我的IDE和控制台中).

@Component({
  selector: 'sprint-tasks',inputs: ['sprintTask'],templateUrl: './views/sprint-tasks.html',directives: [Dragula],providers: [SprintTaskService],viewProviders: [DragulaService]
})

现在,我猜我要么(1)导入文件顶部的组件和/或(2)在我的索引的加载库部分列出库.但文档没有提到这一点,我一直无法弄清楚正确的端点.这几乎就像文档认为这些指令现在应该在npm安装后对系统“天生”,但我不知道这是不是一件事:)

我猜/希望这对于习惯于处理第三方组件的人来说相当明显.感谢您的任何帮助,您可以提供.

解决方法

这个问题的常见罪魁祸首是tsconfig.json文件上的标志.为了正确引用这些文件,您应该使用

"moduleResolution": "node"

你还需要使用像Systemjs这样的模块加载器库或类似的东西来导入它们.

Dragula库应该附带一个bundle,然后您可以将其导入到模块加载器中.使用系统,这应该像在index.html文件中简单地包含bundle一样简单.

<script src="node_modules/dragula/path/to/bundle.js"></script>

或者无论文件被调用.

如果库不包含捆绑包,或者捆绑包不适合您,那么您可以在系统配置中对此进行注释,系统将为您执行此操作.

System.config({
  map:{
    'dragula': 'node_modules/dragula'
  }
});

一如既往,这可能需要对您的确切需求进行一些调整,但应该让您亲近.需要更多信息来进一步微调您特定场景的答案.