Angular 2 - 导入外部传单打字稿定义

Question

我也有同样的问题： Angular 2 - import of external leaflet typescript library

但由于 Angular 2 现在使用 Webpack，如何使用 angular-cli 和 webpack 配置包含“传单”。

Answer 1

我自己找到了答案：

1- 在 package.json 中确保您已添加 @types/geojson、@types/leaflet 和 leaflet 包：

"dependencies": {
......
"@types/geojson": "0.0.31",
"@types/leaflet": "^1.0.40",
"leaflet": "^1.0.2",
.......
}

或者直接添加它们：npm install @types/geojson @types/leaflet leaflet --save

2- 在angular-cli.jsonfile 中找到"styles" 并将leaflet.css 添加到其中：

"styles": [
  .....
  "../node_modules/leaflet/dist/leaflet.css"
],

3- 确保您的 angular-cli 项目中的 tsconfig.json 引用了 @types 文件夹：

"typeRoots": [
  "../node_modules/@types"
]

4- 现在，leaflet 在 angular-cli 项目中可用，您可以通过引用 L 命名空间来使用它：

map: L.Map;
mapOptions: L.MapOptions;