在Angular 2项目中导入并使用带有Typescript 2的非类型传单JS插件

我正在Angular 2应用程序中使用JS库。这个库本身运行良好，因为我已经包含了类型定义（lipper.d.ts），当然还有lipper节点模块

我正在尝试为传单库导入一个名为“”的插件，但没有可用的类型定义，因为每当我尝试包含它时，它都是用ES5编写的，编译器对此感到满意，但我在控制台收到以下错误：

leaflet-src.js:314
Uncaught TypeError: this.callInitHooks is not a function
    at Object.NewClass (http://localhost:2080/main.bundle.js:58716:8)
    at http://localhost:2080/main.bundle.js:77650:180
    at Object.<anonymous> (http://localhost:2080/main.bundle.js:77652:3)
    at __webpack_require__ (http://localhost:2080/inline.js:53:30)
    at Object.<anonymous> (http://localhost:2080/main.bundle.js:54476:18)
    at __webpack_require__ (http://localhost:2080/inline.js:53:30)
    at Object.<anonymous> (http://localhost:2080/main.bundle.js:54411:90)
    at __webpack_require__ (http://localhost:2080/inline.js:53:30)
    at Object.<anonymous> (http://localhost:2080/main.bundle.js:54600:70)
    at __webpack_require__ (http://localhost:2080/inline.js:53:30)

---

这是与缺少键入无关的运行时错误。问题与

传单

版本不匹配有关

似乎

传单画布图标

是为较旧版本的

传单

设计的。尝试退回到版本为

0.7.x

的

传单

 "dependencies": {
        "@angular/common": "2.1.2",
        "@angular/compiler": "2.1.2",
        "@angular/compiler-cli": "2.1.2",
        "@angular/core": "2.1.2",
        "@angular/forms": "2.1.2",
        "@angular/http": "2.1.2",
        "@angular/platform-browser": "2.1.2",
        "@angular/platform-browser-dynamic": "2.1.2",
        "@angular/platform-server": "2.1.2",
        "@angular/router": "3.1.2",
        "@types/leaflet": "0.7.x",
        "core-js": "^2.4.1",
        "leaflet": "0.7.x", // note the change
        "leaflet-canvasicon": "^0.1.6",
        "leafletjs-canvas-overlay": "^1.0.1",
        "rxjs": "5.0.0-rc.1",
        "ts-helpers": "^1.1.2",
        "zone.js": "^0.6.26"
      },
      "devDependencies": {
        "angular-cli": "1.0.0-beta.19-3",
        "ts-node": "1.6.1",
        "tslint": "3.15.1",
        "typescript": "2.0.6",
        "typings": "^1.5.0"
      }
    }

---

将来，您可以记住，

this.callInitHooks不是一个函数

是典型的问题在将旧扩展加载到

传单后

版本>=1

如果需要在typescript中使用传单插件，请在传单后导入此文件

声明模块L{
//扩展类的插件，如L.MyClass
导出类：任意；
//使用类工厂即myClass的插件
导出类：任意；
//扩展控件的插件出现在这里，即L.Control.Navbar
导出命名空间控件{
导出Navbar：任何；
}
//具有控制工厂的插件来到这里，即L.control.navbar
导出命名空间控件{
导出navbar：任何；
}
//扩展层的插件出现在这里，即L.Layer.NewLayer
导出命名空间层{
导出新层：任意；
}
//具有层工厂的插件来到这里，即L.layer.newLayer
导出命名空间层{
导出新层：任意；
}
//扩展处理程序的插件出现在这里，即L.Handler.NewHandler
导出命名空间处理程序{
导出：任何；
}
//具有处理程序工厂的插件来到这里，即L.handler.newHandler
导出命名空间处理程序{
导出：任何；
}
}

---

如果愿意，您可以显式地使用类型。

是的，在返回到

传单0.7版后，它可以工作。但是类型定义仍然需要在与
L.CanvasIcon
相同的名称空间中使用它。您是如何管理使用插件所需的类型定义的？
 "dependencies": {
        "@angular/common": "2.1.2",
        "@angular/compiler": "2.1.2",
        "@angular/compiler-cli": "2.1.2",
        "@angular/core": "2.1.2",
        "@angular/forms": "2.1.2",
        "@angular/http": "2.1.2",
        "@angular/platform-browser": "2.1.2",
        "@angular/platform-browser-dynamic": "2.1.2",
        "@angular/platform-server": "2.1.2",
        "@angular/router": "3.1.2",
        "@types/leaflet": "0.7.x",
        "core-js": "^2.4.1",
        "leaflet": "0.7.x", // note the change
        "leaflet-canvasicon": "^0.1.6",
        "leafletjs-canvas-overlay": "^1.0.1",
        "rxjs": "5.0.0-rc.1",
        "ts-helpers": "^1.1.2",
        "zone.js": "^0.6.26"
      },
      "devDependencies": {
        "angular-cli": "1.0.0-beta.19-3",
        "ts-node": "1.6.1",
        "tslint": "3.15.1",
        "typescript": "2.0.6",
        "typings": "^1.5.0"
      }
    }