javascript - 如何使用 RequireJS 填充 Leaflet + mapbox？

Question

我正在尝试填充传单和地图框。

在我的垫片下面：

require.config({
  paths: {
    'leaflet': '/app/res/libs/leaflet/js/leaflet-1.6.0',
    'leaflet-draw': '/app/res/libs/leaflet/js/leaflet.draw-1.0.4',
    'mapbox': '/app/res/libs/leaflet/js/mapbox-1.6.2'
  },
  shim: {
    'leaflet': {
      exports: 'L'
    },
    'leaflet-draw': {
      deps: ['leaflet']
    },
    'mapbox': {
      deps: ['leaflet'],
    },        
  } // end Shim Configuration
});

define(["leaflet", "leaflet-draw", "mapbox"], function (L, dummy0, dummy1) {
  return L;
});

使用地图上方的垫片可以正常工作，但是当我尝试使用应该由 Mapbox 提供的东西时，我得到一个错误。

例如，下面的代码可以正常工作：

        // Add layers to the map
        L.control.layers({
            'Esri Satellite Map': L.tileLayer('https://server.arcgisonline.com/ArcGIS/rest/services/World_Imagery/MapServer/tile/{z}/{y}/{x}', {
                attribution: 'Tiles © Esri — Source: Esri, i-cubed, USDA, USGS, AEX, GeoEye, Getmapping, Aerogrid, IGN, IGP, UPR-EGP, and the GIS User Community'
            }).addTo(map)
        }).addTo(map);

但是，如果我尝试使用 Mapbox 中的 tileLayer：

        L.control.layers({
            'Mapbox Satellite Map': L.mapbox.tileLayer('bobbysud.map-l4i2m7nd', {
                detectRetina: true
            }).addTo(map),
            'Esri Satellite Map': L.tileLayer('https://server.arcgisonline.com/ArcGIS/rest/services/World_Imagery/MapServer/tile/{z}/{y}/{x}', {
                attribution: 'Tiles © Esri — Source: Esri, i-cubed, USDA, USGS, AEX, GeoEye, Getmapping, Aerogrid, IGN, IGP, UPR-EGP, and the GIS User Community'
            })
        }).addTo(map);

我收到以下错误：

TypeError: Cannot read property 'tileLayer' of undefined

我怎样才能让 Mapbox 工作？

标签： javascriptrequirejsmapbox