如何为Angular2（特别是Dragula）安装组件包装器

我是npm和Angular2的新手。我已经学习了Angular2关于创建初始应用程序的教程，我已经有了一些相当丰富的内容。

我需要在我的应用程序中添加拖放功能，并且相信我应该使用Angular而不是jQueryUI的原生功能。我发现了这个插件：

我已经按照自述文件中的说明进行了操作，看起来它已经安装好了。它位于节点_模块和ng2 dragula下“^1.0.3已添加到我的依赖项中。然后我运行npm安装并启动

尽管如此，当我尝试使用自述文件中指定的指令和提供程序时，它返回not found（在我的IDE和控制台中）

现在，我猜我要么需要（1）导入文件顶部的组件，要么（2）在索引的加载库部分列出库。但是文档中没有提到这一点，我一直无法找出正确的端点。似乎文档认为这些指令在npm安装后应该是系统的“固有”指令，但我不知道这是否是一件事：）

---

我猜/希望这对任何习惯于进口第三方组件的人来说都是显而易见的。感谢您提供的帮助。

此问题的常见原因是tsconfig.json文件上的标志。为了正确引用这些文件，您应该使用

"moduleResolution": "node"

您还需要使用模块加载器库（如Systemjs）或类似的工具导入这些文件

Dragula库应该附带一个捆绑包，然后您可以将其导入模块加载器。使用该系统时，只需将捆绑包包含在

index.html

文件中即可

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

---

像往常一样，这可能需要一些调整，以满足您的确切需求，但应该会让您接近。需要更多信息来进一步微调特定场景的答案。

我将dragula模块的“src”文件夹复制到我的应用程序中，并将指令和服务指向它们，从而使其正常工作<代码>从“./directions/Dragula.directive”导入{Dragula}；从“./providers/dragula.provider”导入{DragulaService}没有关于这方面的文档，但我通过示例了解到了这一点：我仍然想知道是否有更自动化的方法来实现这一点。我按照这里的说明进行了测试，但仍然无法使其正常工作。他们为“app.component.js”建议的

指令：[Dragula]

甚至对

@component

无效：

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

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