Мне удалось заставить Leaflet работать с Angular 2 и Webpack, следуя этому проекту.

угловой стартер

Я вижу настройки, настроенные в "browser.d.ts":

/// <reference path="browser\ambient\leaflet\leaflet.d.ts" />

webpack.config.js определяет точку входа:

...
entry: {
    'polyfills': './src/polyfills.ts',
    'libs': './src/libs.ts',
    'main': './src/main.ts'
},
...

«Libs.ts» содержит импорт модуля Leaflet:

import 'leaflet';

Я использую Atom в качестве редактора кода. Теперь он распознает все классы и методы Leaflet. Теперь я могу делать такие вещи в Angular 2:

import {Map, TileLayer} from 'leaflet';
...
this.baseMaps = {
    StreetMap: new TileLayer('mapbox.streets')
};

Здесь начинаются мои проблемы. Я пытаюсь использовать mapbox.js. Я установил библиотеку mapbox.js и набрал:

npm install mapbox.js --save
typings install mapbox --save

Вот где я застрял. За свою жизнь я не могу понять, как сделать то, что удалось сделать Leaflet.

import 'mapbox';

Не работает

ERROR in ./src/libs.ts
Module not found: Error: Cannot resolve module 'mapbox' in C:\Develop\angular2-webpack-starter\src
 @ ./src/libs.ts 3:0-17

Я вижу, что "browser.d.ts" имеет следующее:

/// <reference path="browser\ambient\leaflet\leaflet.d.ts" />
/// <reference path="browser\ambient\mapbox\mapbox.d.ts" />

Я думал, может быть, Mapbox просто будет работать, потому что он расширяет библиотеку Leaflet?

Кажется, что я могу сделать что-то вроде этого, что является стандартным способом JavaScript:

this.baseMaps = {
    StreetMap: L.mapbox.tileLayer('mapbox.streets')
};

Но не это

this.baseMaps = {
    StreetMap: new TileLayer('mapbox.streets')
};

Это, очевидно, тоже не работает:

import {Map, TileLayer} from 'mapbox';

Что я делаю неправильно?