传单绘制图标未在Vue的生产模式下显示

Question

我有一个使用Leaflet作为地图库的Vue应用程序。在地图上，我添加了使用Leaflet Draw的工具栏和带有Leaflet EasyButton的按钮。我给出一个图像，以便在下面进行说明：

发展

当我创建Vue应用程序的构建版本以保存在服务器上时，该问题开始出现。传单绘制图标不再出现。仅显示Leaflet EasyButton图标。

生产

我的代码如下：

  this.llmap = L.map('map-id', {...})

  let vectorLayerDraw = L.featureGroup([])

  this.llmap.addControl(new L.Control.Draw({
    position: 'topright',
    draw: {
      ...
      rectangle: {
        shapeOptions: {
          color: '#000000',
          opacity: 0.2,
          fillOpacity: 0.1
        }
      }
    },
    edit: {
      featureGroup: vectorLayerDraw,
      poly: {
        allowIntersection: false
      }
    }
  }))

有人知道会发生什么吗？

谢谢。

Answer 1

我正在互联网上寻找问题，并且找到了以下解决方案：

.leaflet-draw-toolbar a {
  background-image: url('../assets/spritesheet.png');
  background-repeat: no-repeat;
  color: transparent !important;
}

在手动将图像添加到静态文件夹的位置，然后覆盖背景图像。

来源：1和2

非常感谢您。