title: How can I set the custom marker icon for my leaflet map with NUXT.js
body: <p>I am trying to change marker icon for separate marker on my OpenStreetMap.</p>
  
  <pre><code>  mapIconsReinit(L) {
      delete L.Icon.Default.prototype._getIconUrl;
  
      L.Icon.Default.imagePath = ''
      L.Icon.Default.mergeOptions({
        iconRetinaUrl: require('@/assets/img/map_markers/default/marker-icon-2x.png'),
        iconUrl: require('@/assets/img/map_markers/default/marker-icon.png'),
        shadowUrl: require('@/assets/img/map_markers/default/marker-shadow.png'),
      });
    },
  
    getMarkerIcon(L, color) {
      return L.divIcon({
        iconRetinaUrl: require('@/assets/img/map_markers/marker-icon-2x-' + color + '.png'),
        iconUrl: require('@/assets/img/map_markers/marker-icon-' + color + '.png'),
        shadowUrl: require('@/assets/img/map_markers/marker-shadow.png'),
        iconSize: [25, 41],
        iconAnchor: [12, 41],
        popupAnchor: [1, -34],
        shadowSize: [41, 41]
      })
    }
  </code></pre>
  
  <p>First function works fine with paths like <code>'@/...'</code>, but the 2nd one - no.</p>
  
  <p>Default marker works fine:</p>
  
  <pre><code>L.marker([marker.lat, marker.lng]).addTo(_context.map)
  </code></pre>
  
  <p>but if I try to use custom marker:</p>
  
  <pre><code>L.marker([marker.lat, marker.lng], {icon: this.getMarkerIcon(L, "red")}).addTo(_context.map)
  </code></pre>
  
  <p>I see a white square</p>
  
  <p><a href="https://i.stack.imgur.com/IAlQX.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/IAlQX.png" alt="enter image description here"></a></p>