Javascript 何时在TypeScript中包含使用脚本标记的JS库？

我在使用

import

语句使TypeScript正常工作时遇到了不少问题

例如，我目前正在使用传单构建Angular2应用程序。我已经设法让一些库正确加载，例如Lodash和传单，但是现在我正在努力让传单插件，molate.MarkerCluster正常工作

我导入的方式如下所示：

import L from 'leaflet';
import 'leaflet.markercluster';

...

ngOnInit() {
    this.map = L.map(this.mapId, options);
    this.activePOICommonLayer = L.markerClusterGroup().addTo(this.map);

    //create marker here;

    this.activePOICommonLayer.addLayer(marker);
}

从“markercluster”导入L

我的SystemJS定义中包含以下内容：

markercluster:'node_模块/传单.markercluster/dist/传单.markercluster'

这会导致加载并附加MarkerCluster文件，例如，当我在控制台中测试它时，我可以从as
L.MarkerClusterGroup
访问它

然而，当我在TypeScript模块中运行它时，我得到了一个错误。我做了一些挖掘，这似乎是由于生成的JavaScript的运行方式。生成的JavaScript实际上并没有试图访问L（传单全局对象），而是访问：

var m=new markercluster_1.default.MarkerClusterGroup（）

检查
markercluster\u 1.default
，我可以看到它是一个空对象。不知道如何解决这个问题，但我在想，在这种情况下是否值得使用import语句？简单地在页面顶部包含一个，并在尝试访问模块的TypeScript文件中使用
//
，是否更有意义

不知道如何解决这个问题，但我在想，在这种情况下是否值得使用import语句

我的意见

避开systemjs。只需使用网页包
使用
require

样本：

import * as leaflet from "leaflet"; 
// Augment leaflet
require('./leaflet.markercluster/dist/leaflet.markercluster');

// use new feature
(leaflet as any).MarkerClusterGroup;

Party我使用Visual Studio代码编写angular 5应用程序，并解决了以下相同问题：

import L from 'leaflet';
import 'leaflet.markercluster';

...

ngOnInit() {
    this.map = L.map(this.mapId, options);
    this.activePOICommonLayer = L.markerClusterGroup().addTo(this.map);

    //create marker here;

    this.activePOICommonLayer.addLayer(marker);
}